tools/convert/color converter
// convertnew

color converter

hex, rgb, hsl, oklch, lab

— enter a color value // client-only
hex — enter a color value
rgb — enter a color value
hsl — enter a color value
oklch — enter a color value
lab — enter a color value

// related tools

timestamp converterunix ↔ date, iso 8601, utc, relativeyaml ↔ jsontwo-way converter with comments preservedcsv ↔ jsonconvert csv to json and back, auto-detect delimiter

// about this tool

The color converter accepts any common color format — hex triplets, rgb() and rgba() CSS functions, hsl() and hsla(), oklch(), and named CSS colors — and instantly shows the equivalent representation in all five formats: HEX, RGB, HSL, OKLCH, and CIELab. The OKLCH and Lab values are computed through a full sRGB → linear → XYZ → OKLab pipeline.

// when to use

  • Convert a design token from HEX to HSL for use in a CSS custom property
  • Inspect the OKLCH lightness and chroma of a brand color for accessibility work
  • Convert a named CSS color like "cornflowerblue" to its hex value
  • Get the Lab coordinates of a color for perceptual uniformity checks

// faq

What is OKLCH and why should I use it?
OKLCH is a perceptually uniform color space where equal numeric steps produce equally perceived changes in lightness, chroma, and hue. It is supported natively in CSS (color: oklch(60% 0.15 240)) and is useful for creating consistent color scales and accessible palettes.
What formats are accepted as input?
HEX (#rgb, #rrggbb, #rrggbbaa), CSS rgb()/rgba(), CSS hsl()/hsla(), CSS oklch(), and any named CSS color (red, cornflowerblue, etc.). The tool auto-detects the format — just type or paste and it will parse on every keystroke.
// history
Pro Cloud Sync — upgrade
no operations yet