Color Picker & Converter
Pick a color or paste one in any format to get HEX, RGB, HSL, HSV, CMYK and OKLCH values, plus a matching scale of tints and shades.
Paste HEX, rgb(), hsl(), oklch() or a name like “tomato”.
Formats
- HEX
– - RGB
– - HSL
– - HSV
– - CMYK
– - OKLCH
–
Tints and shades
Even lightness steps (OKLCH). Click a swatch to select it.
How to convert colors
Pick a color, paste a value in any CSS format, or use the eyedropper to grab a color from anywhere on your screen (Chrome and Edge). Every format updates instantly; copy the one you need for CSS, design tools or print.
The tints and shades below use evenly spaced lightness, so they work well as a ready-made scale for buttons, backgrounds and hover states.
Frequently asked questions
Which color formats can I paste?
HEX (#0b7a63, #fff), rgb(), hsl(), hsv(), oklch() and common CSS color names like tomato or teal, with or without transparency.
What is OKLCH?
OKLCH describes colors by lightness, chroma (intensity) and hue in a way that matches how people see them. Equal steps in lightness look equal, which makes it ideal for building color scales and dark themes.
Is CMYK exact for printing?
No. This CMYK is a simple conversion without a printer profile. For professional printing, ask your printer for their ICC profile and convert in design software.