Sub-atomic styles: an open source set of expertly crafted CSS custom properties for consistent, adaptive design, installable from a CDN or NPM.
CSSDesign SystemsOpen Source+2
open-props.style
Design Systems
designsystems.one
A curated gallery of 120 real-world design systems with evidence-linked guides, plus free interactive token, color and accessibility tools.
What is Design Systems?
DesignSystems.one explains design systems with no theory, just receipts: 120 real-world systems, foundations and guidelines distilled from fourteen years of practice. Each entry compares tradeoffs and leaves you with an evidence-linked decision brief. Free interactive tools cover tokens, color, accessibility and ROI, and the whole project by Kiryl Zhukouski is free and ad-free.
Best for
- Comparing real-world design system tradeoffs
- Learning foundations with evidence, not theory
- Free tools for tokens and color decisions
Key features
- 120 curated real-world design systems
- Evidence-linked decision briefs per system
- Interactive token and color palette tools
- Foundations glossary and registry
- Free, ad-free and openly accessible
Related resources
open-props.style
Extract design tokens from any live website with one command, then track token drift, WCAG contrast and changes over time.
Design SystemsCLIWeb+1
dembrandt.com
Curated directory of interface craft — component libraries, design systems, AI design tools, and inspiration, plus a list of people worth following.
Design ToolsCurationDesign Systems+2
designeer.xyz