HomeGuidesCSS custom properties for colors

CSS custom properties for colors

Structure --color-* variables for theming and runtime switches.

Naming

Use consistent prefixes and semantic aliases consumed by components.

Color

Free online color tools for conversion, palettes, gradients, accessibility, and design systems. 100% client-side — your colors never leave the browser.

Explore

All color tools
Search tools
Compare tools
Guides
Formulas
Alternatives
Calculator tools
QR tools
Image tools
Text tools

Legal

About us
Contact
Privacy policy
Terms & conditions
Disclaimer
Cookie policy
Accessibility
Editorial policy

Guides & compares

Color spaces explained
WCAG color contrast
Palette design guide
Design tokens guide
Tailwind color scales
HEX to RGB vs RGB to HEX
WCAG contrast tools compared
CSS gradient generators

CSS custom properties for colors

Structure --color-* variables for theming and runtime switches.

Browse all color tools

Naming

Use consistent prefixes and semantic aliases consumed by components.