{"id":92591,"url":"https://github.com/brandonhimpfen/awesome-css","name":"awesome-css","description":"A curated list of awesome CSS frameworks, libraries, tools, resources, and inspiration.","projects_count":40,"last_synced_at":"2026-06-04T08:00:24.727Z","repository":{"id":307910367,"uuid":"1031055145","full_name":"brandonhimpfen/awesome-css","owner":"brandonhimpfen","description":"A curated list of awesome CSS frameworks, libraries, tools, resources, and inspiration.","archived":false,"fork":false,"pushed_at":"2026-05-11T04:11:08.000Z","size":30,"stargazers_count":3,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-05-18T19:05:04.123Z","etag":null,"topics":["awesome","awesome-list","awesome-lists","css","web-design","web-development","webdesign","webdevelopment"],"latest_commit_sha":null,"homepage":"https://lnktr.net/awesome","language":"Python","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/brandonhimpfen.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":null,"code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null},"funding":{"ko_fi":"awesomelists","custom":["https://www.paypal.com/donate/?hosted_button_id=3LLKRXJU44EJJ"]}},"created_at":"2025-08-02T22:59:09.000Z","updated_at":"2026-05-11T04:11:13.000Z","dependencies_parsed_at":"2026-04-01T07:00:39.220Z","dependency_job_id":null,"html_url":"https://github.com/brandonhimpfen/awesome-css","commit_stats":null,"previous_names":["awesomelistsio/awesome-css","brandonhimpfen/awesome-css"],"tags_count":0,"template":false,"template_full_name":"brandonhimpfen/awesome-lists-template","purl":"pkg:github/brandonhimpfen/awesome-css","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brandonhimpfen%2Fawesome-css","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brandonhimpfen%2Fawesome-css/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brandonhimpfen%2Fawesome-css/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brandonhimpfen%2Fawesome-css/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/brandonhimpfen","download_url":"https://codeload.github.com/brandonhimpfen/awesome-css/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brandonhimpfen%2Fawesome-css/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":33895175,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-04T02:00:06.755Z","response_time":64,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"created_at":"2025-08-07T01:03:06.103Z","updated_at":"2026-06-04T08:00:24.729Z","primary_language":null,"list_of_lists":false,"displayable":true,"categories":["Frameworks","Architecture","Tools \u0026 Utilities","Design Systems","Inspiration","Code Playgrounds","CSS-in-JS","Preprocessors","Typography","License","Learning Resources","Related Awesome Lists"],"sub_categories":[],"readme":"# Awesome CSS [![Awesome Lists](https://srv-cdn.himpfen.io/badges/awesome-lists/awesomelists-flat.svg)](https://github.com/awesomelistsio/awesome)\n\n[![DOI](https://zenodo.org/badge/1031055145.svg)](https://doi.org/10.5281/zenodo.19673012)  \n[![GitHub Sponsor](https://srv-cdn.himpfen.io/badges/github/github-flat.svg)](https://github.com/sponsors/brandonhimpfen) \u0026nbsp; \n[![Buy Me a Coffee](https://srv-cdn.himpfen.io/badges/buymeacoffee/buymeacoffee-flat.svg)](https://buymeacoffee.com/brandonhimpfen) \u0026nbsp; \n[![Ko-Fi](https://srv-cdn.himpfen.io/badges/kofi/kofi-flat.svg)](https://ko-fi.com/brandonhimpfen) \u0026nbsp; \n[![PayPal](https://srv-cdn.himpfen.io/badges/paypal/paypal-flat.svg)](https://paypal.me/brandonhimpfen)\n\n📌 This repository is archived with Zenodo and can be cited using the DOI above.\n\n\u003e A curated list of awesome CSS frameworks, libraries, tools, resources, and inspiration.\n\nCSS (Cascading Style Sheets) is essential for building visually engaging and responsive web experiences. This list features high-quality resources for developers and designers working with modern CSS.\n\n_Support ongoing maintenance and curation via [GitHub Sponsors](https://github.com/sponsors/brandonhimpfen)._\n\n## Contents\n\n- [Frameworks](#frameworks)\n- [Preprocessors](#preprocessors)\n- [Architecture](#architecture)\n- [Design Systems](#design-systems)\n- [CSS-in-JS](#css-in-js)\n- [Typography](#typography)\n- [Tools \u0026 Utilities](#tools--utilities)\n- [Inspiration](#inspiration)\n- [Learning Resources](#learning-resources)\n- [Code Playgrounds](#code-playgrounds)\n- [Related Awesome Lists](#related-awesome-lists)\n\n## Frameworks\n\n- [Tailwind CSS](https://tailwindcss.com/) – Utility-first CSS framework for rapid UI development.\n- [Bootstrap](https://getbootstrap.com/) – Popular front-end toolkit for building responsive layouts.\n- [Bulma](https://bulma.io/) – A modern CSS framework based on Flexbox.\n- [Foundation](https://get.foundation/) – Responsive front-end framework from Zurb.\n- [UIkit](https://getuikit.com/) – Lightweight and modular front-end framework.\n\n## Preprocessors\n\n- [Sass](https://sass-lang.com/) – Powerful CSS extension language.\n- [Less](https://lesscss.org/) – CSS preprocessor with variables, mixins, and functions.\n- [Stylus](https://stylus-lang.com/) – Expressive, dynamic, robust CSS preprocessor.\n\n## Architecture\n\n- [BEM](https://en.bem.info/) – Block Element Modifier methodology for scalable CSS.\n- [OOCSS](http://oocss.org/) – Object-Oriented CSS encourages reusability.\n- [SMACSS](https://smacss.com/) – Scalable and Modular Architecture for CSS.\n\n## Design Systems\n\n- [Material Design](https://m3.material.io/) – Google’s design system with CSS/JS components.\n- [Carbon Design System](https://carbondesignsystem.com/) – IBM’s open-source design system.\n- [Lightning Design System](https://www.lightningdesignsystem.com/) – Salesforce’s enterprise-grade design framework.\n\n## CSS-in-JS\n\n- [Styled Components](https://styled-components.com/) – Visual primitives for the component age.\n- [Emotion](https://emotion.sh/docs/introduction) – Performant and flexible CSS-in-JS library.\n- [JSS](https://cssinjs.org/) – Author styles in JavaScript with full power of the language.\n\n## Typography\n\n- [Fontsource](https://fontsource.org/) – Self-host open-source fonts with NPM.\n- [Google Fonts](https://fonts.google.com/) – Free and open-source web fonts.\n- [Type Scale](https://type-scale.com/) – Preview typography scales with different fonts.\n\n## Tools \u0026 Utilities\n\n- [Autoprefixer](https://github.com/postcss/autoprefixer) – Parses CSS and adds vendor prefixes.\n- [PurgeCSS](https://purgecss.com/) – Remove unused CSS for optimized builds.\n- [PostCSS](https://postcss.org/) – Transform CSS with JavaScript plugins.\n- [CSS Stats](https://cssstats.com/) – Visualize and analyze your CSS.\n- [Can I use](https://caniuse.com/) – Browser support tables for modern CSS features.\n\n## Inspiration\n\n- [CSS Zen Garden](http://www.csszengarden.com/) – Showcase of CSS design possibilities.\n- [Codrops](https://tympanus.net/codrops/) – Tutorials and design experiments.\n- [CSS-Tricks](https://css-tricks.com/) – Articles and snippets on CSS and front-end dev.\n\n## Learning Resources\n\n- [MDN CSS Reference](https://developer.mozilla.org/en-US/docs/Web/CSS/Reference) – Authoritative CSS documentation.\n- [Learn CSS](https://web.dev/learn/css/) – Google’s structured guide to CSS.\n- [CSS Grid Garden](https://cssgridgarden.com/) – Game to learn CSS Grid.\n- [Flexbox Froggy](https://flexboxfroggy.com/) – Game to learn Flexbox.\n\n## Code Playgrounds\n\n- [CodePen](https://codepen.io/) – Front-end playground for live CSS demos.\n- [JSFiddle](https://jsfiddle.net/) – Test and share HTML, CSS, and JS code snippets.\n- [CSSDeck](http://cssdeck.com/) – Online HTML/CSS/JS playground and sharing platform.\n\n## Related Awesome Lists\n\n- **[Awesome Web Performance](https://github.com/awesomelistsio/awesome-wpo)** – Optimize CSS for performance.\n- **[Awesome Web Accessibility](https://github.com/awesomelistsio/awesome-web-accessibility)** – CSS tools for accessibility.\n- **[Awesome Tailwind CSS](https://github.com/awesomelistsio/awesome-tailwindcss)** – Ecosystem around Tailwind CSS.\n- **[Awesome Design Systems](https://github.com/awesomelistsio/awesome-design-systems)** – Includes CSS-related systems and frameworks.\n  \n## Contribute\n\nContributions are welcome. Please ensure your submission fully follows the requirements outlined in [`CONTRIBUTING.md`](CONTRIBUTING.md), including formatting, scope alignment, and category placement.\n\nPull requests that do not adhere to the contribution guidelines may be closed.\n\n## License\n\n[![CC0](https://mirrors.creativecommons.org/presskit/buttons/88x31/svg/by-sa.svg)](http://creativecommons.org/licenses/by-sa/4.0/)\n","projects_url":"https://awesome.ecosyste.ms/api/v1/lists/brandonhimpfen%2Fawesome-css/projects"}