Nothing uploaded
Color converter
Type or pick a color in any format to get it as HEX, RGB, HSL, HSV, CMYK and OKLCH, with its CSS name and how readable it is as text on white and on black.
HEX, rgb(), hsl(), hsv(), cmyk(), oklch() or a CSS name such as tomato.
Contrast
On white 3.24:1
- AA, normal text: Fail
- AA, large text: Pass
- AAA, normal text: Fail
- AAA, large text: Fail
On black 6.49:1
- AA, normal text: Pass
- AA, large text: Pass
- AAA, normal text: Fail
- AAA, large text: Pass
For text in this color on a white or black background (WCAG 2). Large text is 24 px, or 18.66 px bold.
Formats
Read as HEX.
- HEX
- #1e90ff
- RGB
- rgb(30, 144, 255)
- HSL
- hsl(209.6, 100%, 55.9%)
- HSV (HSB)
- hsv(209.6, 88.2%, 100%)
- CMYK (approximate)
- cmyk(88.2%, 43.5%, 0%, 0%)
- OKLCH
- oklch(65.2% 0.1901 253.21)
- CSS name
- dodgerblue
CMYK uses the simple formula, without a color profile. Printers convert with their own profile, so treat it as a starting point.
What you type stays on this device. Nothing is uploaded.
Did this save you time? DigiTools is free, with no ads and no sign-up. Leave a tip (opens in a new tab) to help keep it that way.
Tell others what you think: review DigiTools on Trustpilot (opens in a new tab).
How to convert a color
- Type or paste a color, such as #1e90ff, rgb(30, 144, 255) or tomato, or choose one with the color picker.
- Read it in every format; each has its own copy button.
- Check the contrast: the ratio on white and on black, and whether text in this color passes WCAG AA and AAA.
Questions
How do I convert HEX to RGB?
A hex color is three pairs of hexadecimal digits: red, green and blue. Each pair is a number from 0 to 255, so in #1e90ff, 1e is 30, 90 is 144 and ff is 255: rgb(30, 144, 255). A short code doubles each digit: #fa0 is #ffaa00.
What do 8-digit hex codes and alpha mean?
The last pair is the opacity, from 00 (transparent) to ff (solid). #1e90ff80 is about half transparent, the same as rgba(30, 144, 255, 0.5).
Why is CMYK only approximate?
Screens mix light and printers mix ink, and how ink looks depends on the printer, the paper and the color profile. This converter uses the simple formula without a profile, which is fine as a starting point. For print work, convert in your design software with your printer’s profile.
What is OKLCH?
A newer way to write colors in CSS: lightness, chroma (how colorful) and hue, designed so equal steps look equally different to the eye, which makes it handy for palettes. A color screens can’t show is brought into range by lowering its chroma.
What contrast does text need?
WCAG 2 asks for at least 4.5:1 between text and its background (level AA), or 3:1 for large text: 24 px, or 18.66 px bold. Level AAA asks for 7:1 and 4.5:1. Ratios aren’t rounded up, so 4.49:1 fails AA.