Color Converter
UI ToolsConvert colors between HEX, RGB, HSL, HSV, CMYK, LAB, and LCH color spaces instantly. Includes a visual color picker and clipboard copy for every format.
HEX
on white3.68:1~ AA
on black5.71:1✓ AA
Luminance24%
White text
Black text
RGB Red · Green · Blue (0–255)
R
G
B
HSL Hue · Saturation · Lightness
H
S
L
Palette
Formats — click any row to copy
HEX
#3B82F6
RGB
rgb(59, 130, 246)
RGBA
rgba(59, 130, 246, 1)
HSL
hsl(217, 91%, 60%)
HSLA
hsla(217, 91%, 60%, 1)
CMYK
cmyk(76%, 47%, 0%, 4%)
CSS var
--color-primary: hsl(217, 91%, 60%);
Decimal
0.231 0.510 0.965
About Color Converter
The Color Converter handles conversions across all major color spaces used in web and print design — HEX, RGB, HSL, HSV, CMYK, CIE-LAB, and LCH — in a single interface. Enter a value in any format and every other representation updates instantly. The built-in color picker lets you select any color visually, and individual copy buttons make it effortless to grab exactly the format you need for CSS, design tokens, or print production workflows.
Features
- ✓Supports HEX, RGB, RGBA, HSL, HSLA, HSV, CMYK, CIE-LAB, and LCH
- ✓Visual color picker (hue/saturation canvas + hue slider + alpha slider)
- ✓Bidirectional conversion: edit any field to update all others
- ✓Individual clipboard copy button for each color format
- ✓Displays nearest CSS named color when applicable
- ✓Perceptual error indicator for out-of-gamut CMYK or LAB values
- ✓History list of recently converted colors
- ✓CSS custom property snippet for immediate design token use
Common Use Cases
- Convert a Figma HEX color to HSL for use in CSS custom properties
- Translate a brand color to CMYK values for print production handoff
- Pick a perceptually uniform hue using the LCH color space
- Verify the exact RGB triplet behind an HSL color in a legacy codebase
- Grab the `oklch()` CSS value for modern wide-gamut display stylesheets
Frequently Asked Questions
QWhy does my HEX color look different when converted to CMYK?
Screen colors (RGB) have a wider gamut than CMYK print colors. Some vivid RGB colors cannot be reproduced exactly in CMYK and are clipped to the nearest printable value.
QWhat is the LCH color space and why should I use it?
LCH (Lightness, Chroma, Hue) is a perceptually uniform color space where equal numerical steps correspond to equal perceived color differences, making it ideal for generating accessible palettes.
QDoes the converter support the oklch() CSS function?
Yes. The LCH output includes both CIE-LCH and the Oklab-based `oklch()` and `oklab()` CSS functions supported in modern browsers.
QHow precise are the conversions?
Conversions use standard ICC color science formulas with D65 white point. Minor rounding differences between tools are expected due to floating-point precision.