User Experience on mobile might not be great yet, but I'm working on it.

Your first time on this page? Allow me to give some explanations.

Awesome CSS

A curated contents of amazing CSS :)

Here you can see meta information about this topic like the time we last updated this page, the original creator of the awesome list and a link to the original GitHub repository.

Last Update: None

Thank you awesome-css-group & contributors
View Topic on GitHub:
awesome-css-group/awesome-css

Search for resources by name or description.
Simply type in what you are looking for and the results will be filtered on the fly.

Further filter the resources on this page by type (repository/other resource), number of stars on GitHub and time of last commit in months.

Complementary Resources

Editor's Draft :black_nib:

CSS Working Group Editor Drafts

2.74K
422
85d
n/a

Mirror of https://hg.css-houdini.org/drafts

1.74K
145
96d
n/a

Parsers :mag:

CSS Object Model implemented in pure JavaScript. It's also a parser!

688
85
12m
MIT

A tool set for CSS including fast detailed parser, walker, generator and lexer based on W3C specs and browser implementations

1.09K
59
4m
MIT

CSS parser with support of preprocessors

296
62
1y 46d
MIT

A decent CSS parser.

101
11
86d
n/a

Collection of parsers written in JavaScript

274
83
1y 10m
n/a

Transforming styles with JS plugins

24.08K
1.31K
87d
MIT

Plugin framework for CSS preprocessing in Node.js

2.78K
138
6y 105d
n/a

Modern CSS to all browsers

147
5
1y 77d
MIT

Preprocessors :pill:

Less. The dynamic stylesheet language.

16.51K
3.47K
96d
Apache-2.0

Transforming styles with JS plugins

24.08K
1.31K
87d
MIT

Sass makes CSS fun!

13.07K
1.94K
115d
n/a

light – weight css preprocessor

1.17K
65
106d
MIT

Expressive, robust, feature-rich CSS language built for NodeJs.

Frameworks :art:

A lite and flexible CSS framework (Inspired by Skeleton CSS)

3
0
8m
GPL-3.0

Modular and customizable Material Design UI components for the web

15.27K
2.04K
85d
MIT

Feature rich CSS framework for the new decade https://shorthandcss.com

229
13
1y 66d
n/a

A new flexbox based CSS micro-framework.

71
5
1y 10m
MIT

A utility-first CSS framework for rapid UI development.

37.06K
1.7K
85d
MIT

Simple CSS library for semantic HTML markup.

A complete Utility First CSS Framework for less than 50kb.

The most popular HTML, CSS, and JS framework.

A modern CSS framework based on Flexbox. Also has Sass import for modification.

A Modern Lightweight Front End CSS framework for faster and easier web development.

A responsive, customizable micro-framework (3kb) with helpful utilities and a grid system.

A fully responsive and comprehensive CSS framework with beautiful controls and simplistic structure.

advanced responsive front-end framework.

A modest, grayish CSS library.

A responsive front-end framework with a built-in dark mode.

Powerful, scalable, Sass-based, BEM, OOCSS framework.

A modern responsive front-end framework based on Material Design.

A minimalist CSS framework.

An HTML-based language and design system that lets you create responsive and accessible high-quality web interfaces with any look.

A set of small, responsive CSS modules that you can use in every web project.

UI Kit with lots of themes and elements.

A lightweight, responsive and modern CSS framework.

Functional CSS for humans.

CSS framework for dummies with zero skills in graphic design.

A lightweight and modular front-end framework.

Fluid grid for mobile, tablet, and desktop.

A Minimal, Lightweight, Responsive framework.

Toolkits :wrench:

A simple and lightweight mixin library for Sass.

Responsive layout toolkit for Sass.

CSS Structure

Reasonable System for CSS Stylesheet Structure

3.77K
171
3y 5m
n/a

A sane, scalable, managed CSS architecture for large UI projects.

Reset and Normalize

Reseter.css - A Futuristic Alternative To Normalize.css And CSS Resets

450
15
32d
MIT

A modern alternative to CSS resets

42.59K
9.53K
2y 6m
MIT

Adds OpenType features—ligatures, kerning, and more—to Normalize.css.

799
30
3y 8m
MIT

A tiny modern CSS reset

2.24K
428
109d
MIT

A best-practices CSS foundation

4.08K
278
8m
CC0-1.0

Unstyle CSS - Forget inconsistencies, let us start with a blank slate.

19
8
1y 2d
MIT

CSS Development at Large-Scale Websites

Code Style Guidelines :book:

Principles of writing consistent, idiomatic CSS.

6.11K
626
6y 101d
n/a

Opinionated CSS styleguide for scalable applications

394
19
5y 19d
MIT

ThinkUp gives you insights into your social networking activity on Twitter, Facebook, Instagram, and beyond.

3.35K
722
4y 4m
GPL-3.0

Style Guide

Style Guide Generators :slot_machine:

A markdown based documentation system for style guides.

2.17K
208
3y 94d
n/a

Easily create and maintain style guides using CSS comments

676
26
4y 6m
n/a

[ON HOLD] Living Style Guides Engine and Maintenance Environment for Front-end Components. Core repository.

556
51
2y 10m
MIT
4
0
9y 104d
n/a

Automatically generate a style guide from your stylesheets.

1.07K
121
7y 48d
MIT

Markdown-based styleguide generator

681
64
5y 10m
n/a

Styleguide generator is a handy little tool that helps you generate good looking styleguides from stylesheets using KSS notation

1.26K
177
1y 7m
MIT

Naming conventions & Methodologies :bulb:

CSS in JS

Framework-agnostic CSS-in-JS with support for server-side rendering, browser prefixing, and minimum CSS generation

5.16K
211
4m
n/a

A plugin for Babel v6 which transforms inline styles defined in JavaScript modules into class names so they become available to, e.g. the className prop of React elements. While transforming, the plugin processes all JavaScript style definitions found and bundles them up into a CSS file, ready to be requested from your web server.

303
10
3y 8m
MIT

React styling. Plain and simple.

22
2
3y 9m
MIT

Modular, scoped CSS with ES6

577
30
4y 89d
MIT

CSS Loader

3.92K
576
85d
MIT

JSS is an authoring tool for CSS which uses JavaScript as a host language.

6.19K
365
84d
MIT

styled component for react & style-loader/usable

34
5
5y 11m
MIT

Use CSS-in-JavaScript with themes for React without being tightly coupled to one implementation

1.63K
117
1y 48d
MIT

Full CSS support for JSX without compromises

6.06K
271
88d
MIT

Visual primitives for the component age. Use the best bits of ES6 and CSS to style your apps without stress 💅

32.73K
1.98K
5m
MIT

A built-time CSS library for styling React components.

4
0
78d
n/a

CSS Polyfills

A library to make creating CSS polyfills much easier.

294
70
4y 4m
MIT

Break free from CSS prefix hell!

3.82K
745
8m
MIT

DEPRECATED: A position: sticky polyfill that works with filamentgroup/fixed-fixed for a safer position:fixed fallback.

1.49K
164
3y 10m
MIT

selectivizr is a JavaScript utility that emulates CSS3 pseudo-classes and attribute selectors in Internet Explorer 6-8.

1.74K
262
8y 5m
n/a

A behavior for Internet Explorer allowing it to recognize and render various CSS3 box decoration properties

2.83K
245
3y 9m
n/a

Miscellaneous

☝️One <div>. Many possibilities.

1.58K
112
2y 8m
MIT

Source code for Chrome/Edge/Firefox/Opera extension Magic CSS (Live editor for CSS, Less & Sass)

119
26
116d
MIT

A CSS bookmarklet that puts pink error boxes (with messages in comic sans) everywhere you write bad HTML.

666
53
10m
n/a

convert xpath to css selector

0
0
7m
MIT

Browser support for CSS, HTML5 and other front-end web technologies.

CSS alternatives for common JS UI components.

Podcasts :radio:

A live podcast with Chris Coyier and Dave Rupert about front-end web design, development, and UX.

A small batch series of interviews on style guides, hosted by Anna Debenham and Brad Frost.

Topics like web publishing, art direction, content strategy, typography, web technology, and more. It's everything web that matters.

Conversations with world experts on changing technologies and future of the web.

Seeking out the best, brightest, and smartest creative people on digital art, design, and development.

The tagline for the Changelog says it all: “Open Source moves fast. Keep up.” This podcast, and the accompanying blog, is all about keeping you updated with the latest in Open Source Technology.

A Tasty Treats Podcast for Web Developers.

Twitter :satellite:

Author of @Autoprefixer, http://easings.net and @PostCSS.

Web Designer. Professor at @multimedial_utn HTML5 & CSS Freak. Ocassional Translator.

Author of the @Codrops CSS Reference & Co-author of the Smashing Book #5.

CSS goblin & Sass hacker at @edenspiekermann.

Front-end dev, Teacher @GA_London, Screencaster at http://www.atozcss.com, property snob, Foodie.

Moderate consumer of rice. Also a UX designer, author, @smashingmag editor and programmer.

Advocate for users and open-source.

Designer, developer, writer. Occasionally blogs at http://Hop.ie, and currently building @cssanimation.

Latest commits to @CSSWG’s public Mercurial repository.

Author of @responsiblerwd, now on sale from @abookapart.

Web development writer, teacher, and speaker.

Web designer/developer specializing in CSS, RWD, UX, & accessibility.

Final year web technologies student. node.js, javascript, open source modules, client side optimisation, web performance.

Googler who noodles with code and design.

Software Engineer at @twitter.

Consultant Front-end Architect: @google, @Etsy, @kickstarter, @BBC, @Deloitte, @FT, more.

Engineer at Google • Open Source Advocate • Developer • Designer • Writer.

Research Assistant @MIT_CSAIL, @CSSWG IE, @OReillyMedia author, Ex @W3C staff.

aka Mary Lou @codrops ༶ CSS & HTML are my crayons ༶ Interested in Cognitive Science, AI, HCI, UI Design & Astrophysics ༶ Digital nomad.

Front-end @IBMDesign. Sassvocate, community builder, & handcrafter. STEMinist :) Open source all the things.

Designer @CodePen. Writer @Real_CSS_Tricks.

Engineer at Google working on Chrome, web components, and Polymer.

Lover of mountains, craft beers and discovering new food.

Web developer, author of CSS: The Missing Manual, JavaScript & jQuery.

Mozilla developer, CSS and W3C standards diplomat.

W3C CSS Working Group Co-chairman, entrepreneur, software engineer, geek, father of two, polyglot, duck lover. Nah. Tweets are strictly mine.

Loves love. Hates hate. Has a kick-ass family. Writes code. Leads stylesheet tech @LinkedIn.

Literally Jenn Schiffer's Mom.

Trans coder lady. Lead designer/developer of @SassCSS, working for @google on @dart_lang.

Web designer, speaker, writer, consultant, musician.

Freelance front-end vigilante, UI/UX developer.

GitHub and Bootstrap. Formerly at Twitter. Huge nerd.

UI designer, CSS doodler.

All about CSS sizing units.

Designer, Developer, Writer, Speaker. I make stuff on the web. I wrote SMACSS.

Web Developer, half of @grabaperch CMS, CSS Working Group Invited Expert.

Videos :tv:

A useful list of must-watch talks about CSS

3.91K
231
4m
CC0-1.0

2019

2016

2015

Books :books:

Better Solutions to Everyday Web Design Problems

Really Helpful in Advancing your Design Skills to a whole new Level

Solving responsive layout problems using algorithmic design.

Tutorials :clapper:

Interactive gamified tutorial for learning selection with CSS.

Simple tutorial to learn CSS Grid from Mozilla.

A curated collection of useful CSS snippets you can understand in 30 seconds or less.

Free video course by Wes Bos to learn flexbox.

Free video course by Wes Bos to learn CSS Grids.