Color Converter
Paste a color in any format: HEX, RGB, HSL, CMYK, LAB, OKLCH or a CSS name. Every other format appears at the same time, ready to copy.
Everything is calculated in your browser: no color is sent anywhere.
About this tool
This color converter understands almost every way of writing a color: HEX codes with 3, 4, 6 or 8 digits, rgb() and rgba(), hsl() and hsla(), the HSV (or HSB) values of design apps, hwb(), CMYK, lab() and lch() in CIELAB, oklab() and oklch(), plus the 148 CSS color names such as tomato or navy. Paste a value exactly as it appears in a mock-up, a stylesheet or a brand guide: it is recognised automatically and converted into every other format at once.
Each row copies in one click and can also be your starting point: edit the HSL or OKLCH value and everything else follows. The preview handles transparency, a slider sets the opacity, and the contrast of text on white and on black is calculated with the WCAG rules (AA and AAA). Calculations follow the CSS Color 4 specification, with a warning when a LAB or OKLCH color falls outside the gamut of screens. A ready-to-paste CSS block gives you a custom property, the RGB channels and a modern OKLCH value.
- HEX, RGB, HSL, HSV, HWB, CMYK, LAB, LCH, OKLAB, OKLCH
- 148 CSS names, with the closest match
- Free input in any format
- Opacity with HEXA, RGBA and HSLA
- AA and AAA contrast on white and black
- Ready-to-paste CSS block
How to use it
- Paste or type a color, or choose one with the picker.
- Read every format and the preview, and adjust the opacity if needed.
- Check the contrast on white and on black.
- Copy the value you need or the whole CSS block.