tools / color
Color tools.
Convert between HEX, RGB, HSL, OKLCH and CMYK. Generate harmonies. Check WCAG contrast. Everything runs locally — no dependencies, no upload, no tracking.
Type any CSS color (HEX, rgb(), hsl(), oklch(), cmyk()) — see it in every other format.
All formats
- HEX
#20b2aa - RGB
rgb(32 178 170) - HSL
hsl(176.7 69.5% 41.2%) - OKLCH
oklch(69.12% 0.1142 188.96) - CMYK
cmyk(82% 0% 4.5% 30.2%)
FAQ
- Why OKLCH instead of just LCH or LAB?
- OKLCH (built on Oklab) is perceptually uniform — equal numeric changes correspond to roughly equal perceived changes. It's the format CSS Color Module Level 4 recommends for design-token systems because hue stays consistent across lightness levels, unlike HSL where reds and blues at the same 'lightness' look very different.
- Are these color values uploaded anywhere?
- No. All math runs in JavaScript in your browser. There is no server. Open the network tab while you type — you won't see a single request.
- Why doesn't my CMYK match my printer?
- CMYK conversions on the web are naive — they use a 'device CMYK' formula that ignores the specific ink set and paper. For prepress work, generate the CMYK you need from a color profile in InDesign / Photoshop, not from a web tool. This tool is fine for rough conversions and reference.
- What does WCAG AA / AAA mean?
- AA is the legally common standard (4.5:1 for normal text, 3:1 for large text). AAA is stricter (7:1 / 4.5:1) and harder to hit while keeping a non-grey palette. Large text means 18pt+ regular weight or 14pt+ bold. If you have to pick one, target AA.