awesome-css
CSS reference
A curated collection of resources and tools for writing high-quality CSS code
A curated contents of amazing CSS :)
5k stars
129 watching
423 forks
last commit: 22 days ago
Linked from 5 awesome lists
awesomeawesome-listcsslist
Awesome CSS / Introduction / Complementary Resources | |||
| CSS - MDN - Mozilla | |||
| Reddit (CSS) | |||
| StackOverflow (CSS) | |||
Awesome CSS / CSS Working Group / Editor's Draft | |||
| W3c/csswg-drafts | 4,502 | 6 days ago | Mirror of CSS WG Editor Draft repository |
| W3c/css-houdini-drafts | 1,838 | about 1 month ago | Mirror of Houdini WG Editor repository |
Awesome CSS / Parsers | |||
| CSSOM | 753 | over 1 year ago | CSS Object Model implemented in pure JavaScript |
| CSSTree | 1,902 | 18 days ago | Detailed CSS parser with syntax validator |
| Gonzales PE | 330 | almost 2 years ago | CSS parser with support for preprocessors |
| Mensch | 113 | almost 2 years ago | A decent CSS parser |
| ParserLib | 287 | about 5 years ago | CSSLint/parser-lib |
| PostCSS | 28,519 | 6 days ago | Transforming styles with JS plugins |
| Rework | 2,760 | over 3 years ago | Plugin framework for CSS preprocessing in Node.js |
| Stylecow | 163 | over 4 years ago | Modern CSS for all browsers |
Awesome CSS / Preprocessors | |||
| LESS | 17,032 | about 1 month ago | Backwards compatible with CSS, and the extra features it adds use existing CSS syntax |
| PostCSS | 28,519 | 6 days ago | Transforming CSS with JS plugins |
| Sass | 15,129 | 6 days ago | Mature, stable, and powerful professional-grade CSS extension language |
| STYLIS | 1,739 | about 2 months ago | Light-weight CSS preprocessor |
| Stylus | Expressive, robust, feature-rich CSS language built for NodeJs | ||
| Vanilla Extract | Generate static CSS using Typescript. Write type‑safe, locally scoped classes, variables and themes | ||
Awesome CSS / Frameworks | |||
| AgnosticUI | Accessible CSS component primitives that also work with React, Vue 3, Svelte, and Angular | ||
| Bonsai | A complete Utility First CSS Framework for less than 50kb | ||
| Bootstrap | The most popular HTML, CSS, and JS framework | ||
| Bulma | A modern CSS framework based on Flexbox. Also has Sass import for modification | ||
| Butter Cake | A Modern Lightweight Front End CSS framework for faster and easier web development | ||
| Charts.css | CSS data visualization framework | ||
| Chota | A responsive, customizable micro-framework (3kb) with helpful utilities and a grid system | ||
| Cirrus | A fully responsive and comprehensive CSS framework with beautiful controls and simplistic structure | ||
| Foundation | advanced responsive front-end framework | ||
| Gralig | A modest, grayish CSS library | ||
| Halfmoon | A responsive front-end framework with a built-in dark mode | ||
| Hasser CSS | 3 | over 4 years ago | A lightweight (12k, not minified) but useful CSS framework with flexible Grid, Hero and more |
| Inuit.css | Powerful, scalable, Sass-based, BEM, OOCSS framework | ||
| Material-components-web | 17,147 | 9 days ago | Modular and customizable Material Design UI components for the web |
| Materialize | A modern responsive front-end framework based on Material Design | ||
| Milligram | A minimalist CSS framework | ||
| Numl | An HTML-based language and design system that lets you create responsive and accessible high-quality web interfaces with any look | ||
| Pure.css | A set of small, responsive CSS modules that you can use in every web project | ||
| Semantic UI | Powerful framework that uses human-friendly HTML | ||
| Shorthand Framework | 256 | almost 2 years ago | Feature rich CSS framework for the new decade |
| Spectre.css | A lightweight, responsive and modern CSS framework | ||
| Strawberry | 73 | over 5 years ago | A set of common flexbox utilities focused on making your life easier and faster with nested flexboxes |
| Tachyons | Functional CSS for humans | ||
| Tacit | CSS framework for dummies with zero skills in graphic design | ||
| Tailwindcss | 83,083 | 6 days ago | A utility-first CSS framework for rapid UI development |
| Tronic247 Material | A responsive framework based on CSS and some JS while following Material Design guidelines | ||
| UIkit | A lightweight and modular front-end framework | ||
| Unsemantic | Fluid grid for mobile, tablet, and desktop | ||
| Wing | A Minimal, Lightweight, Responsive framework | ||
Awesome CSS / Toolkits | |||
| Bourbon | A simple and lightweight mixin library for Sass | ||
Awesome CSS / Reset and Normalize | |||
| CSS Checker | 578 | about 2 years ago | Find and Reduce Similar & Duplicated CSS Scripts |
| MiniReset.css | 2,778 | 4 months ago | A tiny modern CSS reset |
| Normalize-OpenType | 794 | about 7 years ago | Adds OpenType features—ligatures, kerning, and more—to Normalize.css |
| Normalize | 52,532 | 5 months ago | A set of CSS rules that provide better cross-browser consistency in the default styling of HTML elements |
| Reset.css | CSS Tools: Reset CSS | ||
| Reseter.css | 1,224 | 6 days ago | A Futuristic CSS Reset/Normalizer. That Redifines Instead Of Preserving |
| Sanitize.css | 5,219 | 2 months ago | A set of CSS rules that style with today’s best practices out-of-the-box |
| Unstyle.css | 29 | 10 months ago | Specialised stylesheet for removing user agent styles, style the web with your baseline |
Awesome CSS / CSS Development at Large-Scale Websites | |||
| Bugsnag's CSS Architecture | by | ||
| CSS at BBC Sport | by Shaun Bent | ||
| CSS AT HOOTSUITE | by Steve Mynett | ||
| GitHub's CSS | by | ||
| How we do CSS at Ghost | by Paul Davis | ||
| Lonely Planet | by | ||
| Medium’s CSS is actually pretty good. | by | ||
| Refining The Way We Structure Our CSS At Trello | by | ||
| Scalable-css-reading-list | 1,536 | 5 months ago | |
Awesome CSS / Code Style Guidelines | |||
| Code Guide | by | ||
| CSS Guidelines | by | ||
| CSS Styleguide | 419 | over 8 years ago | by |
| Dropbox (S)CSS Style Guide | 1,172 | about 5 years ago | by Dropbox |
| Google HTML/CSS Style Guide | by Google | ||
| Idiomatic CSS | 6,655 | almost 2 years ago | by |
| Official Trello CSS Guide | by Bobby Grace | ||
| Sass Guidelines | by | ||
| SASS Style Guide | by Sass team | ||
| ThinkUp CSS Style Guide | 3,300 | almost 8 years ago | by ThinkUp |
| WordPress CSS Coding Standards | by WorldPress | ||
Awesome CSS / Style Guide | |||
| AUI | by Atlassian Design | ||
| Design Elements | by lonely planet | ||
| Fluent UI | 18,528 | 6 days ago | by Microsoft |
| GitHub CSS Style Guide | by Github | ||
| Lighting Design System | by Salesforce | ||
| Patterns | by MailChimp | ||
| Solid | by BuzzFeed | ||
| Style Guide | by Starbucks | ||
| Website Style Guide Resources | by Awesome people | ||
Awesome CSS / Style Guide Generators | |||
| Hologram | 2,161 | over 1 year ago | |
| mdcss | 686 | over 6 years ago | |
| Source | 548 | over 6 years ago | |
| Styledoc | 7 | almost 13 years ago | |
| Styledocco | 1,067 | almost 7 years ago | |
| Styledown | 667 | over 7 years ago | |
| Sc5-styleguide | 1,261 | almost 2 years ago | |
Awesome CSS / Naming conventions & Methodologies | |||
| Atomic Design | |||
| Atomic OOBEMITSCSS | |||
| BEM | |||
| ITCSS | |||
| Kickoff CSS | |||
| MaintainableCSS | |||
| NCSS | |||
| OOCSS | |||
| Point North | |||
| RSCSS | |||
| SUIT CSS | 3,802 | over 2 years ago | |
| Title CSS | |||
Awesome CSS / CSS in JS | |||
| Aphrodite | 5,350 | over 3 years ago | |
| Babel-plugin-css-in-js | 298 | about 7 years ago | |
| Classy | 24 | over 7 years ago | |
| Csjs | 575 | almost 8 years ago | |
| Css-loader | 4,311 | 23 days ago | |
| JSS | 7,079 | 3 months ago | |
| React-styled | 39 | over 8 years ago | |
| React-with-styles | 1,704 | 7 months ago | |
| Styled-jsx | 7,715 | 4 months ago | |
| Styled-components | 40,515 | 3 months ago | |
| Stylin | 181 | 7 months ago | |
Awesome CSS / CSS Polyfills | |||
| Polyfill.js | 296 | almost 8 years ago | A library to make creating CSS polyfills much easier |
| Prefixfree | 3,821 | about 3 years ago | Break free from CSS prefix hell |
| Fixed-sticky | 1,487 | over 7 years ago | A CSS position:sticky polyfill |
| Selectivizr | 1,707 | almost 8 years ago | A JavaScript utility that emulates CSS3 pseudo-classes and attribute selectors in Internet Explorer 6-8 |
| PIE | 2,783 | over 6 years ago | Allows Internet Explorer to recognize and render various CSS3 box decoration properties |
Awesome CSS / Miscellaneous | |||
| Beautiful CSS box-shadow examples | Curated collection of 93 beautiful CSS box-shadow. Click to copy | ||
| Can I use | Browser support for CSS, HTML5 and other front-end web technologies | ||
| Flexbox Patterns | by cjcenizal | ||
| Glassmorphism CSS Generator | Generate CSS for glassmorphism | ||
| GradientArt | An advanced CSS gradient editor with layering, design tools and free cloud storage | ||
| Live editor for CSS and LESS | 277 | 4 months ago | Magic CSS extension for Chrome, Firefox and Edge |
| RevengeCSS | 838 | 4 months ago | A CSS bookmarklet that uses selectors to find bad markup, displaying ugly pink error messages in comic sans serif wherever you write bad HTML |
| Single Div Project | 1,592 | over 3 years ago | One . Many possibilities |
| You Might Not Need JS | CSS alternatives for common JS UI components | ||
| Xpath-to-selector | 11 | over 1 year ago | Convert xpath to css selector |
Awesome CSS / Podcasts | |||
| CSS Podcast | Una Kravets and Adam Argyle,and development | ||
| Non Breaking Space Show | Seeking out the best,and smartest creative people on digital art,and the accompanying blog,and UX | ||
| Shop Talk Show | A live podcast with Chris Coyier and Dave Rupert about front-end web design,hosted by Anna Debenham and Brad Frost | ||
| Style Guide Podcast | A small batch series of interviews on style guides,art direction,brightest,content strategy,design,Developer Advocates from Google,development,gleefully breakdown complex aspects of CSS into digestible episodes covering everything from accessibility to z-index | ||
| Syntax | A Tasty Treats Podcast for Web Developers.,typography,web technology | ||
| The Big Web Show | Topics like web publishing,is all about keeping you updated with the latest in Open Source Technology | ||
| The Changelog | The tagline for the Changelog says it all: “Open Source moves fast. Keep up.” This podcast,and more. It's everything web that matters | ||
| The Web Ahead | Conversations with world experts on changing technologies and future of the web | ||
Awesome CSS / Twitter | |||
| Adam Morse | Advocate for users and open-source | ||
| Andrey Sitnik | Author of @Autoprefixer, and @PostCSS | ||
| Ben Briggs | Final year web technologies student. node.js, javascript, open source modules, client side optimisation, web performance | ||
| Brad Frost | Web designer, speaker, writer, consultant, musician | ||
| Chris Coyier | Designer @CodePen. Writer @Real_CSS_Tricks | ||
| Connor Sears | Designer at GitHub | ||
| CSS Animation | |||
| CSS Commits | Latest commits to @CSSWG’s public Mercurial repository | ||
| Daniel Glazman | W3C CSS Working Group Co-chairman, entrepreneur, software engineer, geek, father of two, polyglot, duck lover. Nah. Tweets are strictly mine | ||
| Dave McFarland | Web developer, author of CSS: The Missing Manual, JavaScript & jQuery | ||
| Donovan Hutchinson | Designer, developer, writer. Occasionally blogs at , and currently building @cssanimation | ||
| Dudley Storey | Web development writer, teacher, and speaker | ||
| Eric Bidelman | Engineer at Google working on Chrome, web components, and Polymer | ||
| Evangelina Ferreira | Web Designer. Professor at @multimedial_utn HTML5 & CSS Freak. Ocassional Translator | ||
| Guy Routledge | Front-end dev, Teacher @GA_London, Screencaster at , property snob, Foodie | ||
| Harry Roberts | Consultant Front-end Architect: @google, @Etsy, @kickstarter, @BBC, @Deloitte, @FT, more | ||
| Heydon Pickering | Moderate consumer of rice. Also a UX designer, author, @smashingmag editor and programmer | ||
| Jonathan Snook | Designer, Developer, Writer, Speaker. I make stuff on the web. I wrote SMACSS | ||
| Kitty Giraudel | Non-binary accessibility & diversity advocate, frontend developer, author | ||
| L. David Baron | Mozilla developer, CSS and W3C standards diplomat | ||
| Lea Verou | Research Assistant @MIT_CSAIL, @CSSWG IE, @OReillyMedia author, Ex @W3C staff | ||
| Manoela Ilic | ...aka Mary Lou @codrops ༶ CSS & HTML are my crayons ༶ Interested in Cognitive Science, AI, HCI, UI Design & Astrophysics ༶ Digital nomad | ||
| Mark Otto | GitHub and Bootstrap. Formerly at Twitter. Huge nerd | ||
| Maxime Thirouin | Freelance front-end vigilante, UI/UX developer | ||
| Natalie Weizenbaum | Trans coder lady. Lead designer/developer of @SassCSS, working for @google on @dart_lang | ||
| Nicolas Gallagher | Software Engineer at @twitter | ||
| Nicole Sullivan | GEEK | ||
| Patrick Hamann | Lover of mountains, craft beers and discovering new food | ||
| Paul Lewis | Googler who noodles with code and design | ||
| Phil Walton | Engineer at Google • Open Source Advocate • Developer • Designer • Writer | ||
| Rachel Andrew | Web Developer, half of @grabaperch CMS, CSS Working Group Invited Expert | ||
| Remy Sharp | All about CSS sizing units | ||
| Sara Soueidan | Author of the @Codrops CSS Reference & Co-author of the Smashing Book #5 | ||
| Scott Jehl | Author of @responsiblerwd, now on sale from @abookapart | ||
| Simon | UI designer, CSS doodler | ||
| The Chris Eppstein | Loves love. Hates hate. Has a kick-ass family. Writes code. Leads stylesheet tech @LinkedIn | ||
| Una Kravets | Front-end @IBMDesign. Sassvocate, community builder, & handcrafter. STEMinist :) Open source all the things | ||
| Zoe M. Gillenwater | Web designer/developer specializing in CSS, RWD, UX, & accessibility | ||
| Zoltán Szőgyényi | Web developer, Co-founder at Themesberg. I'm building Glass UI | ||
| 앗킨스 탭 | Literally Jenn Schiffer's Mom | ||
Awesome CSS / Videos / 2019 | |||
| Next-Generation Web Styling | Una Kravets & Adam Argyle @ Chrome Dev Summit 2019 | ||
Awesome CSS / Videos / 2016 | |||
| Component-Based Style Reuse | Pete Hunt @ CSS conf 2016 | ||
| CSS4 Grid: True Layout Finally Arrives | Jen Kramer @ CSS conf 2016 | ||
| Houdini: Demystifying the Future of CSS | @ Google I/O 2016 | ||
Awesome CSS / Videos / 2015 | |||
| Mdo-ular CSS | Mark Otto @ jQuery UK | ||
| CSS Architecture with SMACSS | Caleb Meredith @ DevTips channel | ||
| CSS Workflow from the Ground Up | Jonathan Snook @ Generate conf 2015 | ||
Awesome CSS / Books | |||
| CSS: The Definitive Guide, 4th Edition | Visual Presentation for the Web | ||
| CSS: The Missing Manual | – Really Helpful in Advancing your Design Skills to a whole new Level | ||
| CSS Secrets | – Better Solutions to Everyday Web Design Problems | ||
| Every Layout: Relearn CSS Layout | – Solving responsive layout problems using algorithmic design | ||
| Tiny CSS Projects | – Improve the way you write CSS as you build 12 tiny projects | ||
Awesome CSS / Tutorials | |||
| 30 Seconds of CSS | A curated collection of useful CSS snippets you can understand in 30 seconds or less | ||
| All selectors in CSS | All selectors in CSS | ||
| Community Curated CSS Resources | Top Recommended Resources | ||
| CSS Diner | – Interactive gamified tutorial for learning selection with CSS | ||
| CSS Grid PlayGround | Simple tutorial to learn CSS Grid from Mozilla | ||
| CSS Grids videos tutorial | Free video course by Wes Bos to learn CSS Grids | ||
| CSS Hands-on Tutorial | Free CSS hands-on tutorial by LabEx | ||
| CSS Math Functions | Using CSS Math for responsive design | ||
| Flexbox video tutorial | Free video course by Wes Bos to learn flexbox | ||
| Organize CSS with a Modular Architecture: OOCSS, BEM, SMACSS | In-depth intro to OOCSS, BEM, SMACSS, with examples | ||
| Work With Animations | Inspecting animations | ||
sindresorhus/awesome
sorrycc/awesome-javascript
bayandin/awesome-awesomeness
jnv/lists
0ex/more-awesome
wbkd/riotjs-startkit
enb/enb
miripiruni/frontdesk
perchlabs/webird
uncss/uncss
anorudes/redux-easy-boilerplate
coryhouse/react-slingshot
ai/size-limit
amarcu5/piper
georgewritescode/laravel-react-typescript-boilerplate
michelebertoli/css-in-js
whitestormjs/whitestorm-typescript-boilerplate