css-and-javascript-frameworks-collection

CSS (Awesome)

List of awesome CSS frameworks.
Feel free to contribute.

Supported by FrontAid CMS

Base / Reset / Normalize

Class-less

Frameworks that use semantic HTML and do not rely on classes.

Very Lightweight

Frameworks that are smaller than ~5KB.

General Purpose

Material Design

Utility-based

Specialized

Toolkits

Toolkits are closer to a library than to a framework. They do not provide actual styling but utilities (e.g. mixins) that you can use in your CSS preprocessor.

Stalled Development

Frameworks that have not seen any real development for more than about one year or officially have been deprecated. We are keeping them here for reference/inspiration and hope for a revival.

Show Section - [**Semantic UI**](https://semantic-ui.com) - User interface is the language of the web. ![](https://img.shields.io/github/stars/semantic-org/semantic-ui.svg?style=social&label=Star) [Docs](https://semantic-ui.com/introduction/getting-started.html), [Repo](https://github.com/semantic-org/semantic-ui) | #LESS - [**normalize.css**](https://necolas.github.io/normalize.css/) - Modern, HTML5-ready alternative to CSS resets. ![](https://img.shields.io/github/stars/necolas/normalize.css.svg?style=social&label=Star) [Repo](https://github.com/necolas/normalize.css/) | #CSS - [**Materialize**](https://materializecss.com) - CSS framework based on material design. ![](https://img.shields.io/github/stars/Dogfalo/materialize.svg?style=social&label=Star) [Demo](https://materializecss.com/showcase.html), [Docs](https://materializecss.com/getting-started.html), [Repo](https://github.com/Dogfalo/materialize) | #SCSS - [**Spectre.css**](https://picturepan2.github.io/spectre/) - Lightweight, responsive and modern CSS framework. ![](https://img.shields.io/github/stars/picturepan2/spectre.svg?style=social&label=Star) [Docs](https://picturepan2.github.io/spectre/getting-started.html), [Repo](https://github.com/picturepan2/spectre) | #SCSS - [**Flexbox Grid**](https://flexboxgrid.com) - Grid based on CSS3 flexbox. ![](https://img.shields.io/github/stars/kristoferjoseph/flexboxgrid.svg?style=social&label=Star) [Repo](https://github.com/kristoferjoseph/flexboxgrid) - [**Basscss**](https://basscss.com) - Low-level CSS toolkit. ![](https://img.shields.io/github/stars/basscss/basscss.svg?style=social&label=Star) [Repo](https://github.com/basscss/basscss/) - [**Neat**](https://neat.bourbon.io/) - Lightweight and flexible Sass grid. ![](https://img.shields.io/github/stars/thoughtbot/neat.svg?style=social&label=Star) [Demo](https://neat.bourbon.io/examples/), [Docs](https://neat.bourbon.io/docs/latest/), [Repo](https://github.com/thoughtbot/neat) | #SCSS - [**mini.css**](https://minicss.org) - Minimal, responsive, style-agnostic CSS framework. ![](https://img.shields.io/github/stars/Chalarangelo/mini.css.svg?style=social&label=Star) [Docs](https://minicss.org/docs), [Repo](https://github.com/Chalarangelo/mini.css) | #SCSS - [**Mobi.css**](https://getmobicss.com) - Lightweight, scalable, mobile-first CSS framework. ![](https://img.shields.io/github/stars/mobi-css/mobi.css.svg?style=social&label=Star) [Docs](https://getmobicss.com/docs/introduction.html), [Repo](https://github.com/mobi-css/mobi.css) | #CSS - [**Wing**](https://kbrsh.github.io/wing/) - Beautiful CSS framework designed for minimalists. ![](https://img.shields.io/github/stars/kbrsh/wing.svg?style=social&label=Star) [Docs](https://kbrsh.github.io/wing/#installation), [Repo](https://github.com/kbrsh/wing) | #Stylus - [**CSS Remedy**](https://github.com/jensimmons/cssremedy) - Start your project with a remedy for the technical debt of CSS. ![](https://img.shields.io/github/stars/jensimmons/cssremedy.svg?style=social&label=Star) | #CSS - [**Cutestrap**](https://www.cutestrap.com) - Sassy, opinionated CSS framework, a tiny alternative to Bootstrap. ![](https://img.shields.io/github/stars/tylerchilds/cutestrap.svg?style=social&label=Star) [Repo](https://github.com/tylerchilds/cutestrap) - [**unsemantic**](https://unsemantic.com) - Fluid grid for mobile, tablet, and desktop. ![](https://img.shields.io/github/stars/nathansmith/unsemantic.svg?style=social&label=Star) [Demo](https://unsemantic.com/demo-responsive), [Docs](https://unsemantic.com/css-documentation), [Repo](https://github.com/nathansmith/unsemantic) - [**Propeller**](https://propeller.in) - Front-end responsive framework based on Google's Material Design standards & Bootstrap. ![](https://img.shields.io/github/stars/digicorp/propeller.svg?style=social&label=Star) [Docs](https://propeller.in/frameworks/open-source/get-started/), [Repo](https://github.com/digicorp/propeller) | #SCSS - [**Concise CSS**](https://concisecss.com) - Give up the bloat. Stop tripping over your classes. Be concise. ![](https://img.shields.io/github/stars/ConciseCSS/concise.css.svg?style=social&label=Star) [Docs](https://concisecss.com/documentation/), [Repo](https://github.com/ConciseCSS/concise.css) | #SCSS - [**Responsive Boilerplate**](https://responsivebp.com) - Powerful, accessible, developer friendly framework for building responsive websites. ![](https://img.shields.io/github/stars/responsivebp/responsive.svg?style=social&label=Star) [Docs](https://responsivebp.com/getting-started/), [Repo](https://github.com/responsivebp/responsive) | #SCSS - [**Centurion**](https://www.centurionframework.com) - Web-based framework for rapid prototyping and building larger web projects. ![](https://img.shields.io/github/stars/justinhough/Centurion.svg?style=social&label=Star) [Docs](https://github.com/justinhough/Centurion/blob/master/DOCUMENTATION.md), [Repo](https://github.com/justinhough/Centurion)

License

License CC0 1.0:

You can copy, modify, distribute and perform the work, even for commercial purposes, all without asking permission. Images of GitHub stars are provided by Shields.

JavaScript (Awesome)

A collection of awesome browser-side JavaScript libraries, resources and shiny things.


Package Managers

Host the JavaScript libraries and provide tools for fetching and packaging them.

Component Management

Loaders

Module or loading system for JavaScript.

Bundlers

Minimizers

Type Checkers

Testing Frameworks

Frameworks

Assertion

Coverage

Runner

QA Tools

MVC Frameworks and Libraries

Node-Powered CMS Frameworks

Templating Engines

Templating engines allow you to perform string interpolation.

Game Engines

Articles and Posts

Data Visualization

Data visualization tools for the web.

There’re also some great commercial libraries, like amchart, anychart, plotly, highchart, and lightning chart.

Timeline

Spreadsheet

Editors

Documentation

Files

Libraries for working with files.

Functional Programming

Functional programming libraries to extend JavaScript’s capabilities.

Reactive Programming

Reactive programming libraries to extend JavaScript’s capabilities.

Data Structure

Data structure libraries to build a more sophisticated application.

Date

Date Libraries.

String

String Libraries.

Number

Storage

Color

I18n And L10n

Localization (l10n) and internationalization (i18n) JavaScript libraries.

Control Flow

Routing

Security

Log

RegExp

Voice Command

API

Streaming

Vision Detection

Machine Learning

Browser Detection

Operating System

Benchmark

Web Worker

Code highlighting

Loading Status

Libraries for indicate load status.

Validation

Keyboard Wrappers

Tours And Guides

Notifications

Sliders

Range Sliders

Form Widgets

Input

Calendar

Select

File Uploader

Other

Modals and Popups

Scroll

Table/Grid

Frameworks

Boilerplates

Images

Maps

Video/Audio

https://flowplayer.com/

Typography

Animations

Image Processing

ES6

Generators

SDK

Misc

Podcasts

Worth Reading

Other Awesome Lists

Contributing

Contributions welcome! Read the contribution guidelines first.

License

CC0

To the extent possible under law, chencheng has waived all copyright and related or neighboring rights to this work.

JS & CSS (Jose Ernesto Martins & me)