Color Converter

What is Color Converter?

Color Converter is a free online tool for converting CSS color codes between every notation a web developer actually uses: HEX, RGB(A), HSL(A), HWB and OKLCH. Paste a color in any supported format — #8b5cf6, rgb(139 92 246 / 50%), hsl(258, 89.5%, 66.3%), hwb(258 36% 4%) or a keyword like rebeccapurple — and get every other notation instantly, ready to copy. (Working with image files instead of color codes? Need to convert an image's color space, like sRGB or Display P3? Use the [Color Space Converter](/color-space).)

Features

• Every input syntax — #rgb, #rgba, #rrggbb, #rrggbbaa, rgb()/rgba() and hsl()/hsla() in both comma and modern space/slash syntax, hwb(), and all 148 CSS color keywords
• Every output notation — HEX, RGB(A), HSL(A), HWB and OKLCH, formatted exactly the way CSS expects them
• CSS keyword match — when your color exactly equals a named color, you get the keyword
• Tailwind v3 match — the nearest color from the default Tailwind v3 palette, measured in perceptual OKLab distance (hidden when nothing is genuinely close)
• WCAG contrast — contrast ratios against pure white and pure black, with AA/AAA badges for normal text, compositing translucent colors over the background first
• Alpha-aware preview — the big swatch sits on a checkerboard so transparency is actually visible, and the native color picker preserves your alpha instead of resetting it

A note on OKLCH input

OKLCH is supported as an output only. Accepting OKLCH as input would require gamut mapping — many valid OKLCH coordinates lie outside the sRGB gamut, and silently clipping them would hand you the wrong color. Rather than guess, this tool keeps inputs strictly inside sRGB notations where every value is representable.

How to use

Type or paste a color into the input, or use the color picker. All notations update live, each with a one-click copy button. Translucent colors (alpha below 1) produce 8-digit HEX and rgba()/hsla() outputs. The contrast rows tell you immediately whether white or black text passes WCAG AA (4.5:1) or AAA (7:1) on top of your color.

Privacy

Conversion runs entirely in your browser — the colors you enter are not uploaded. (A public API endpoint also exists for programmatic use; anything you send there is, by definition, transmitted.)