How to use the color converter
- Paste or type a color: #2e6f95, 2e6f95, rgb(46 111 149), hsl(202 53% 38%), oklch(…) or a CSS name like teal.
- Or use the picker, or move the red, green and blue sliders.
- Copy any format with the button at the end of its row.
Which format to use where
- HEX is the shortest and the most common in design files and style guides.
- RGB is what screens are made of. The modern CSS syntax drops the commas:
rgb(46 111 149). - HSL is handy for quick tweaks of lightness and saturation, but equal HSL lightness does not look equally light across hues.
- OKLCH fixes that: its lightness matches perception, so it is the best format for building shades and themes in modern CSS.
- CMYK is for print. The value here is a direct formula; real print values depend on the paper and press profile.
HEX to RGB, by hand
A HEX color is three pairs of base-16 digits. Convert each pair: 2e is 2 × 16 + 14 = 46, 6f is 111, 95 is 149. So #2e6f95 is rgb(46 111 149). Going back, divide each channel by 16: the quotient is the first digit and the remainder the second.
Need the color as text on a background? Check it in the contrast checker, or grow it into a full set of shades with the scale generator.
Questions
How do I convert HEX to RGB?
Paste the HEX value into the input. The RGB value appears instantly in both the modern space-separated syntax and the legacy comma syntax.
Is the CMYK value print-ready?
No converter can be exact without the printer's ICC profile. Use the value as a starting point and convert in InDesign, Illustrator or Affinity with the right profile.
What is OKLCH?
A color format based on the OKLab model: L is perceived lightness, C is chroma (colorfulness) and H is hue. All current major browsers support oklch() in CSS.