Color Tools
4 free color tools, all running privately in your browser.
These free color tools let you convert between HEX, RGB, HSL, and other formats, check WCAG contrast ratios, generate palettes, and build CSS gradients and shadows. Each renders a live preview instantly in your browser so you can see results as you work.
Color work spans both aesthetics and accessibility. Converting formats keeps your CSS consistent, while contrast checking ensures text is actually readable for the roughly 1 in 12 men with color vision deficiency. Our guide on color contrast and WCAG explains the thresholds these tools check against.
Color Converter
Convert colors between HEX, RGB, and HSL.
Contrast Checker
Check WCAG color contrast for accessibility.
Box Shadow Generator
Design CSS box shadows visually.
Border Radius Generator
Design CSS border-radius visually.
Frequently asked questions
What contrast ratio do I need?
WCAG AA requires 4.5:1 for normal text and 3:1 for large text. AAA requires 7:1 and 4.5:1 respectively. The contrast checker tells you which levels a color pair passes.