Color Converter

Convert between HEX, RGB, HSL, and CMYK color formats

✓ Runs 100% in your browser — no data sent to servers
HEX
RGB
HSL
CMYK
Accessibility Contrast Ratios
vs White (#FFFFFF)
vs Black (#000000)
Ready WCAG AA requires 4.5:1 for normal text

Frequently Asked Questions

What's the difference between HEX, RGB, and HSL?

HEX uses hexadecimal notation (#RRGGBB), RGB uses decimal values for red, green, blue (0-255), and HSL uses hue (0-360°), saturation (0-100%), and lightness (0-100%). All represent the same colors but in different formats useful for different contexts.

When should I use CMYK?

CMYK (Cyan, Magenta, Yellow, Key/Black) is used for print design, not web or screen display. If you're designing something that will be printed (brochures, business cards, etc.), you need CMYK values. For web and digital, use HEX, RGB, or HSL.

What is a contrast ratio?

Contrast ratio measures the difference in luminance between two colors, typically text and background. WCAG accessibility guidelines require a minimum ratio of 4.5:1 for normal text and 3:1 for large text to ensure readability for people with visual impairments.

How do I pick a color from an image?

Most operating systems have built-in color picker tools. On Windows, use PowerToys Color Picker. On Mac, use Digital Color Meter. Pick the color, then paste the HEX value into this tool to convert it to other formats.

Can I convert colors for CSS?

Yes! All formats shown here work in CSS. HEX (#4f6ef7), RGB (rgb(79, 110, 247)), and HSL (hsl(227, 91%, 64%)) are all valid CSS color values. Choose whichever format you prefer for your stylesheet.

What does the Random button do?

The Random button generates a random color and displays it in all formats. It's useful for exploring color palettes, finding inspiration, or testing your design with different color combinations.