CSS Custom Properties Generator
Build a complete design token system with colors, typography, spacing, shadows, and breakpoints.
Color Palette
Add base colors. Shades (50-950) are generated automatically.
Typography Scale
Spacing Scale
Shadow Tokens
sm
md
lg
xl
2xl
inner
Border Radius Tokens
Breakpoint Definitions
px
px
px
px
Generated CSS Custom Properties
:root {}
🚀 Explore 125+ Free Developer Tools
From CSS generators to JSON formatters — all free, no signup required.
Browse All Tools →