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 269 Free Developer Tools
From CSS generators to JSON formatters — all free, no signup required.
Browse All Tools →Related Tools
CSS Box Shadow Generator · Emoji Picker & Search · Favicon Generator · Free JSON Formatter & Validator · Meta Tag Generator
Related Tools
Free Icon Generator · Free Color Palette Generator · Free CSS Variable Visualizer
Related Tools
Free Color Palette Generator · Free JSON to YAML Converter · Free Accessibility Checker
Related Tools
Free JSON to YAML Converter · YAML to JSON Converter · Free API Mock Server