Color Converter
Convert colors between HEX, RGB, HSL, and CMYK, with a built-in WCAG contrast checker.
rgb(99, 102, 241)hsl(239, 84%, 67%)59%
C58%
M0%
Y5%
Kcmyk(59%, 58%, 0%, 5%)vs White — 4.47:1
AA (large text only)
vs Black — 4.70:1
AA (normal text)
About Color Converter
This Color Converter lets you enter a color in any of the four most common formats — HEX (#6366f1), RGB (rgb(99, 102, 241)), HSL (hsl(239, 84%, 67%)), or CMYK (for print) — and instantly see it converted to the others, with a live swatch preview. It also includes a built-in WCAG contrast checker showing the exact contrast ratio and pass/fail rating (AA/AAA) against both white and black backgrounds, so you can immediately tell whether a color is readable as text or needs adjusting for accessibility. It's useful for designers moving between design tools and CSS, or developers who need to translate a brand color into different formats. Click any value to copy it directly to your clipboard.
Frequently Asked Questions
RGB defines a color by red, green, and blue light intensity (0–255 each). HSL defines it by Hue (color angle 0–360°), Saturation (%), and Lightness (%) — often more intuitive for adjusting a color's shade or brightness.
A HEX code is a 6-digit (or 3-digit shorthand) base-16 representation of an RGB color, prefixed with #, e.g. #6366f1. It's the most common format used in CSS and design tools.
CMYK (Cyan, Magenta, Yellow, Key/black) is used for print design, since printers mix physical ink rather than emitting light like a screen. Always confirm exact print colors with your printer's proof, since CMYK conversion from a screen color is an approximation.
A ratio of 4.5:1 or higher passes WCAG AA for normal text, 3:1 passes AA for large text only, and 7:1 or higher passes the stricter AAA level. These thresholds are the standard used for web accessibility compliance.
Yes, HEX, RGB, and HSL are all valid CSS color values you can paste directly into stylesheets.