Four formats sit side by side — edit HEX from Figma, RGB from a token file, HSL from CSS, or OKLCH from a modern stylesheet. Every panel updates the others instantly.
Use the preview bar and native color picker for quick tweaks. All conversion runs in your browser; nothing is uploaded to a server.
You can convert between HEX (#RRGGBB), RGB/RGBA, HSL/HSLA, and OKLCH — the perceptually uniform format used in modern CSS. Four panels sit side by side; edit any one and the others update instantly.
No. All parsing and conversion run in your browser. Color values never leave your device.
OKLCH expresses color as lightness (L), chroma (C), and hue (H). It is designed for predictable adjustments — for example, changing lightness without skewing hue — and is supported in current browsers via CSS Color Level 4.
Conversions go through sRGB and OKLab math with rounding at each step. Tiny differences (±1 on a channel) are normal and still produce visually identical colors.
Yes. Use the native color picker under the preview swatch. It updates HEX, RGB, HSL, and OKLCH together.
Yes. Use rgba(), hsla(), 8-digit HEX (#RRGGBBAA), or OKLCH with an alpha slash (oklch(L C H / 0.5)). The preview shows a checkerboard behind semi-transparent colors.
Yes. It is free, requires no signup, and works offline after the page loads.