A curated list of awesome CSS frameworks, libraries, tools, resources, and inspiration.
CSS (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.
- Frameworks
- Preprocessors
- Architecture
- Design Systems
- CSS-in-JS
- Typography
- Tools & Utilities
- Inspiration
- Learning Resources
- Code Playgrounds
- Related Awesome Lists
- Tailwind CSS – Utility-first CSS framework for rapid UI development.
- Bootstrap – Popular front-end toolkit for building responsive layouts.
- Bulma – A modern CSS framework based on Flexbox.
- Foundation – Responsive front-end framework from Zurb.
- UIkit – Lightweight and modular front-end framework.
- Sass – Powerful CSS extension language.
- Less – CSS preprocessor with variables, mixins, and functions.
- Stylus – Expressive, dynamic, robust CSS preprocessor.
- BEM – Block Element Modifier methodology for scalable CSS.
- OOCSS – Object-Oriented CSS encourages reusability.
- SMACSS – Scalable and Modular Architecture for CSS.
- Material Design – Google’s design system with CSS/JS components.
- Carbon Design System – IBM’s open-source design system.
- Lightning Design System – Salesforce’s enterprise-grade design framework.
- Styled Components – Visual primitives for the component age.
- Emotion – Performant and flexible CSS-in-JS library.
- JSS – Author styles in JavaScript with full power of the language.
- Fontsource – Self-host open-source fonts with NPM.
- Google Fonts – Free and open-source web fonts.
- Type Scale – Preview typography scales with different fonts.
- Autoprefixer – Parses CSS and adds vendor prefixes.
- PurgeCSS – Remove unused CSS for optimized builds.
- PostCSS – Transform CSS with JavaScript plugins.
- CSS Stats – Visualize and analyze your CSS.
- Can I use – Browser support tables for modern CSS features.
- CSS Zen Garden – Showcase of CSS design possibilities.
- Codrops – Tutorials and design experiments.
- CSS-Tricks – Articles and snippets on CSS and front-end dev.
- MDN CSS Reference – Authoritative CSS documentation.
- Learn CSS – Google’s structured guide to CSS.
- CSS Grid Garden – Game to learn CSS Grid.
- Flexbox Froggy – Game to learn Flexbox.
- CodePen – Front-end playground for live CSS demos.
- JSFiddle – Test and share HTML, CSS, and JS code snippets.
- CSSDeck – Online HTML/CSS/JS playground and sharing platform.
- Awesome Web Performance – Optimize CSS for performance.
- Awesome Web Accessibility – CSS tools for accessibility.
- Awesome Tailwind CSS – Ecosystem around Tailwind CSS.
- Awesome Design Systems – Includes CSS-related systems and frameworks.
Contributions are welcome. Please ensure your submission fully follows the requirements outlined in CONTRIBUTING.md, including formatting, scope alignment, and category placement.
Pull requests that do not adhere to the contribution guidelines may be closed.