CSS Variables Live Editor

New

Define a set of colors for light and dark themes. Get the CSS custom properties snippet. Toggle live.

Design CSS variables dark mode generator theme

New

Paste your CSS and see a static fallback version where var() is replaced with the default value. For legacy support.

Developer Tools CSS variables fallback legacy polyfill

New

Paste a list of hex colors and generate CSS custom properties for them. Create your design token file instantly.

Color Tool CSS variables generator palette swatch

New

Pick colors for the shadcn/ui design system and generate the complete CSS variable theme file. Copy into your project.

Developer Tools CSS variables generator shadcn/ui theme

Tag: CSS Variables Live Editor