Awesome CSS Frameworks

List of awesome CSS frameworks
By troxler

awesome-list awesome css css-framework list collection

List of awesome CSS frameworks.
Feel free to contribute.

Supported by FrontAid CMS:

Contents

Base / Reset / Normalize

Class-less

Very Lightweight

General Purpose

Material Design

Utility-based

Specialized

Toolkits

Stalled Development

Base / Reset / Normalize

normalize.css - Modern, HTML5-ready alternative to CSS resets.

Repo
| #CSS

sanitize.css - The best-practices CSS foundation.

Repo
| #CSS

minireset.css - Tiny modern CSS reset.

Repo
| #Sass

inuitcss - Extensible, scalable, Sass-based, OOCSS framework for large and long-lasting UI projects.

Repo
| #SCSS

modern-css-reset - Tiny little reset that you can use as the basis of your CSS projects.

Repo
| #CSS

ress - Modern CSS reset.

Repo
| #CSS

modern-normalize - Normalize for Chrome, Firefox, and Safari only (no support for Edge or Internet Explorer).

Repo
| #CSS

Natural Selection - Collection of best-practice CSS selectors.

| #CSS

Class-less

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

Water.css - Just-add-CSS collection of styles to make simple websites just a little nicer.

Repo
| #CSS

MVP.css - Minimalist stylesheet for HTML elements.

Docs,
Repo
| #CSS

sakura - Minimal classless CSS framework/theme.

Demo,
Repo
| #SCSS

Marx - Classless CSS reset.

Docs,
Repo
| #SCSS #Stylus

Tacit - CSS framework for dummies, without classes.

Repo
| #SCSS

awsm.css - CSS library for semantic HTML markup without classes, attributes, etc.

Demo,
Repo
| #SCSS

Very Lightweight

Frameworks that are smaller than ~5KB.

Pure - Set of small, responsive CSS modules that you can use in every web project.

Demo,
Docs,
Repo
| #CSS

Milligram - Minimalist CSS framework.

Demo,
Docs,
Repo
| #Sass

Picnic CSS - Lightweight and beautiful library.

Demo,
Docs,
Repo
| #SCSS

Chota - Really small CSS framework.

Demo,
Docs,
Repo
| #CSS

General Purpose

Bootstrap - The most popular HTML, CSS, and JavaScript framework for developing responsive, mobile first projects on the web.

Demo,
Docs,
Repo
| #SCSS

Bulma - Modern CSS framework based on Flexbox.

Demo,
Docs,
Repo
| #Sass

Foundation - The most advanced responsive front-end framework in the world.

Docs,
Repo
| #SCSS

UIkit - Lightweight and modular front-end framework for developing fast and powerful web interfaces.

Demo,
Docs,
Repo
| #LESS #SCSS

Spectre.css - Lightweight, responsive and modern CSS framework.

Docs,
Repo
| #SCSS

Primer - CSS framework that powers GitHub's front-end design.

Docs,
Repo
| #SCSS

Carbon Components - Component library behind IBM's Carbon Design System.

Docs,
Repo
| #SCSS

Fomantic-UI - Build beautiful websites fast, with concise HTML, intuitive javascript, and simplified debugging.

Docs,
Repo
| #LESS

Blaze UI - Open source modular toolkit providing great structure for building websites quickly with a scalable and maintainable foundation.

Demo,
Docs,
Repo
| #SCSS

PatternFly - UI framework for enterprise web applications.

Demo,
Docs,
Repo
| #SCSS #LESS

Base - Rock solid, responsive HTML/CSS framework.

Docs,
Repo
| #SCSS #LESS

turretcss - Responsive front-end framework for accessible and semantic websites.

Demo,
Docs,
Repo
| #CSS

Cirrus - Component and utility centric SCSS framework designed for rapid prototyping.

Demo,
Docs,
Repo
| #CSS

Pico.css - Elegant styles for all native HTML elements, dark mode automatically enabled.

Demo,
Docs,
Repo
| #SCSS

HiQ - Simple CSS foundation with responsive typography and input styling.

Docs,
Repo
| #PostCSS

Material Design

Material Components Web - Modular and customizable Material Design UI components for the web.

Demo,
Docs,
Repo
| #SCSS

MUI - Lightweight CSS framework that follows Google's Material Design guidelines.

Docs,
Repo
| #SCSS

Utility-based

Tailwind CSS - Utility-first CSS framework for rapid UI development.

Docs,
Repo
| #CSS

Tachyons - Quickly build and design new UI without writing CSS.

Demo,
Docs,
Repo
| #CSS

Specialized

NES.css - NES-style CSS Framework.

Demo,
Docs,
Repo
| #SCSS

98.css - CSS library for building interfaces that look like Windows 98.

Repo
| #CSS

Gutenberg - Modern framework to print the web correctly.

Demo,
Docs
| #SCSS

Tufte CSS - Style your webpage like Edward Tufte’s handouts.

Repo
| #CSS

Bojler - Email framework for developing responsive and lightweight email templates.

Docs,
Repo
| #SCSS

TuiCss - Library to create MS-DOS interfaces.

Demo,
Docs
| #SCSS

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.

Bourbon - Lightweight Sass tool set.

Docs,
Repo,
Scaffold
| #SCSS

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

- [**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

- [**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

- [**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.