Color Converter

About color formats

What color formats does this tool understand?

Hex (#f00, #ff0000, or with alpha as #ff0000ff), rgb()/rgba(), hsl()/hsla(), oklch() (comma or modern space-separated syntax, percentages allowed for all of these), and a set of common named CSS colors like red, tomato, or cornflowerblue. Paste any of these into the field and it auto-detects which format you used.

Why does the color picker only support opaque colors?

HTML's native color picker intentionally has no alpha/transparency channel — that's a browser platform limitation, not something this tool restricts. To convert a translucent color, type rgba(...), hsla(...), or an 8-digit hex directly into the text field instead of using the picker.

What's CMYK, and why include it?

CMYK (cyan/magenta/yellow/black) is the ink-based color model used for print, distinct from the light-based RGB that HEX/RGB/HSL all describe. Converting RGB to CMYK is only an approximation — a screen's color gamut and a printer's inks don't map perfectly — but it's a solid ballpark figure when handing a color off to a print designer.

What's OKLCH, and why would I use it over HSL?

OKLCH is a newer, perceptually uniform color space (part of CSS Color Module 4, supported in all current browsers). In HSL, the same lightness value can look very different in perceived brightness depending on hue — pure blue and pure yellow at L=50% don't look equally bright. In OKLCH, equal lightness steps look equally bright across every hue, which makes it much better for building color scales, gradients, and dark/light theme variants that actually feel consistent.

Why might a converted OKLCH value look slightly different after a round trip?

OKLCH can describe colors outside what a standard screen (sRGB) can display. When converting an out-of-gamut OKLCH value to HEX/RGB/HSL/CMYK, this tool clamps it to the nearest color your screen can actually show — so converting that result back to OKLCH won't exactly match the original out-of-gamut input. This only affects unusually vivid colors near the edge of the sRGB gamut.

Does this tool upload my data anywhere?

No. Every conversion happens entirely in your browser using plain JavaScript math. Nothing you type or pick ever leaves your device.

Configuration options

Color picker

Sets the input field to the picked color as opaque hex. Like the text field, it needs a click on Convert afterward to update the output values.