Color Converter
Convert between HEX, RGB, HSL and OKLCH with contrast
How it works
Type any CSS color — a hex code, rgb()/hsl()/oklch() value, or a named color like 'tomato' — or use the picker. It's parsed by the browser and converted to HEX, RGB, HSL and OKLCH, each ready to copy. The contrast panel shows WCAG ratios against white and black so you can check legibility.
Frequently asked
What is OKLCH?
A modern, perceptually-uniform color space (Lightness, Chroma, Hue) supported in CSS. It makes lightness and hue adjustments look more consistent to the eye than HSL.
Which inputs are accepted?
Anything the browser understands: hex (#rgb / #rrggbb / #rrggbbaa), rgb()/rgba(), hsl()/hsla(), oklch(), and named colors.
How is contrast calculated?
Using the WCAG relative-luminance formula. A ratio of 4.5:1 meets AA for normal text; 3:1 meets AA for large text.