Revolutionize your code reviews with AI. CodeRabbit offers PR summaries, code walkthroughs, 1-click suggestions, and AST-based analysis. Boost productivity and code quality across all major languages with each PR. Learn more →
Top 23 CSS Design Projects
-
Project mention: A deliberate practice app for guitar players who want to level up | news.ycombinator.com | 2025-03-31
Thanks! Much credit goes to the Bulma[1] css framework, I guess. I am mostly a backend dev. I've just used bulma for the most part and tried to avoid anything fancy.
[1]: https://bulma.io/
-
InfluxDB
InfluxDB high-performance time series database. Collect, organize, and act on massive volumes of high-resolution data to power real-time intelligent systems.
-
But in this example we will take a preset with Tachyons, a once popular library. But here the naming is even more deplorable:
-
IBM Plex Mono is pretty good, with a reasonable license. It's on Google Fonts, and the repo is here: https://github.com/IBM/plex
-
adamschwartz/magic-of-css - A CSS course to turn you into a magician.
-
eludadev/ui-buttons - 100 Modern CSS Buttons. Every style that you can imagine.
-
-
A free collection of 180 linear gradients with CSS3 code is available at WebGradients. These gradients can add depth and visual interest to your web designs. The website provides ready-to-use gradient codes, making it easy to incorporate beautiful color transitions into your projects.
-
CodeRabbit
CodeRabbit: AI Code Reviews for Developers. Revolutionize your code reviews with AI. CodeRabbit offers PR summaries, code walkthroughs, 1-click suggestions, and AST-based analysis. Boost productivity and code quality across all major languages with each PR.
-
-
Style Stage
-
matcha
🍵 Drop-in semantic styling library in pure CSS. Highly customizable and perfect for simple websites and prototyping web apps!
Project mention: Show HN: Mizu.js – Bringing back simplicity in web apps creation | news.ycombinator.com | 2024-12-19The learning curve is that small.
Also, you may have heard of https://matcha.mizu.sh, a CSS stylesheet to instantly make your web page stylized.
-
-
Trig.js
Trig.js powers dynamic, CSS-driven animate-on-scroll effects using CSS variables and element position data, making AOS effortless. Create custom animations in CSS or use trig-animations.css for ready-made effects—full control or quick setup. Perfect for storytelling websites.
Project mention: 🚀 Enhancing Scroll Animations with Trig.js: New Features in v4.1.0 and v4.2.0 | dev.to | 2025-03-31Trig.js is open-source and welcomes contributions from the community. Explore the GitHub repository to access documentation, report issues, and contribute to the project's growth.
-
-
-
-
-
-
-
-
-
orincywhyte_frontendengineer
A portfolio project by CodeCademy to showcase my Html, Css and JavaScript. Design and Code by me
-
-
SaaSHub
SaaSHub - Software Alternatives and Reviews. SaaSHub helps you find the best software and product alternatives
NOTE:
The open source projects on this list are ordered by number of github stars.
The number of mentions indicates repo mentiontions in the last 12 Months or
since we started tracking (Dec 2020).
CSS Design discussion
CSS Design related posts
-
How to style HTML with matcha.css
-
Bulma CSS: A Modern CSS Framework for Responsive Design
-
List of awesome CSS frameworks, libraries and software
-
Bulma CSS is now 1.0.0
-
Part 3: Templating HTML with Python, Jinja2 and serverless WebAssembly
-
Lalipo - spotify playlist generator
-
Am I supposed to ignore these vulnerabilities?
-
A note from our sponsor - CodeRabbit
coderabbit.ai | 29 Apr 2025
Index
What are some of the best open-source Design projects in CSS? This list will help you:
| # | Project | Stars |
|---|---|---|
| 1 | Bulma | 49,713 |
| 2 | tachyons | 11,651 |
| 3 | plex | 10,605 |
| 4 | magic-of-css | 6,656 |
| 5 | ui-buttons | 3,536 |
| 6 | argon-design-system | 2,473 |
| 7 | webgradients | 2,438 |
| 8 | hugo-paper | 2,241 |
| 9 | stylestage | 2,188 |
| 10 | matcha | 1,847 |
| 11 | modern-fluid-typography-editor | 344 |
| 12 | Trig.js | 137 |
| 13 | tachyons-verbose | 109 |
| 14 | css-flags | 98 |
| 15 | ant-design-svelte | 98 |
| 16 | bulma-stylus | 30 |
| 17 | logo_maker | 28 |
| 18 | components | 23 |
| 19 | Portfolio | 8 |
| 20 | Cola | 6 |
| 21 | Darkrange-BetterDiscord-Theme | 1 |
| 22 | orincywhyte_frontendengineer | 1 |
| 23 | axl-flat-ui | 1 |
Sponsored
InfluxDB high-performance time series database
Collect, organize, and act on massive volumes of high-resolution data to power real-time intelligent systems.
influxdata.com