Type any hex code or pick a color. Codigrate shows you the matching RGB, HSL, HSV, CMYK, LAB, OKLCH and HWB values, finds the nearest RAL Classic color, checks readability with the WCAG 2 contrast ratio and APCA (WCAG 3) Lc score, builds complementary, split, triadic, tetradic, analogous and monochrome schemes, generates ready-to-use example palettes from your color, and shows how your color reads to people with Protanomaly, Deuteranomaly, Tritanopia or Achromatopsia.
How it works
One hex code, read every way a designer, a printer or a browser reads it
Type a hex code or pick a color and the page converts it to RGB, HSL, HSV, HWB, CMYK, LAB, OKLCH, OKLAB and the nearest RAL Classic, then builds the harmony schemes, the tints, shades and tones, the temperature and example palettes around it. The color is the link, so every hex code has its own page you can share.
Readability is checked with the WCAG 2 contrast ratio and the APCA (WCAG 3) Lc score against black and white, and the color is shown as people with Protan, Deutan, Tritan and Monochromacy vision see it. Everything is computed in your browser. Take the color further with the palette generator or a wallpaper.
Questions
- What is a hex color code?
- Six hexadecimal digits behind a hash, two each for red, green and blue, from 00 to FF. #FF0000 is pure red, #FFFFFF is white and #000000 is black. Three digit codes like #F00 are shorthand for doubled digits.
- Which color space should I use?
- Hex and RGB for the web and code, HSL or HSV when you want to reason in hue, saturation and lightness, CMYK for print, OKLCH when steps have to look evenly spaced to the eye, and RAL when the color has to be matched in paint or powder coating.
- What do the WCAG and APCA numbers mean?
- The WCAG 2 contrast ratio runs from 1 to 21; body text needs 4.5 and large text 3 to pass AA. APCA gives an Lc value from 0 to 106 that tracks how readable text really is; 60 is the usual floor for body text and 75 for small text.
- Is the color tool free?
- Yes, for any use, with no sign in. Every hex code has its own shareable page, and the conversions, schemes and example palettes can be copied straight into your project.
