Color Converter & Palette Generator

Convert colors between HEX, RGB, HSL & CMYK, generate palettes and check contrast.

{{ line }}
Complementary
{{ col }}
Analogous
{{ col }}
Triadic
{{ col }}
Split-Complementary
{{ col }}
Sample Text White Text
Contrast Ratio: {{ whiteContrast }}:1
WCAG AA Normal Text: {{ whiteContrastVal >= 4.5 ? __t('pass') : __t('fail') }} | WCAG AA Large Text: {{ whiteContrastVal >= 3 ? __t('pass') : __t('fail') }}
WCAG AAA Normal Text: {{ whiteContrastVal >= 7 ? __t('pass') : __t('fail') }} | WCAG AAA Large Text: {{ whiteContrastVal >= 4.5 ? __t('pass') : __t('fail') }}
Sample Text Black Text
Contrast Ratio: {{ blackContrast }}:1
WCAG AA Normal Text: {{ blackContrastVal >= 4.5 ? __t('pass') : __t('fail') }} | WCAG AA Large Text: {{ blackContrastVal >= 3 ? __t('pass') : __t('fail') }}
WCAG AAA Normal Text: {{ blackContrastVal >= 7 ? __t('pass') : __t('fail') }} | WCAG AAA Large Text: {{ blackContrastVal >= 4.5 ? __t('pass') : __t('fail') }}

What Is a Color Converter?

A Color Converter enables instant conversion of color values between different color spaces like HEX, RGB, HSL and CMYK. Web designers and developers use different color formats depending on context — HEX for CSS, RGB for image editing, HSL for intuitive color adjustment and CMYK for print.

Color Spaces Explained: HEX, RGB, HSL, CMYK

HEX is a 6-digit hexadecimal value (#RRGGBB) commonly used in CSS. RGB defines colors via Red, Green and Blue values (0–255). HSL describes colors via Hue (0–360°), Saturation and Lightness — ideal for intuitive color adjustments. CMYK (Cyan, Magenta, Yellow, Key/Black) is used for print.

Color Theory & Harmonies

Color harmonies are based on the position of colors on the color wheel. Complementary colors are opposite (180°) and create maximum contrast. Analogous colors are adjacent (±30°) and feel harmonious. Triadic colors are evenly spaced (120°) and offer vibrant combinations. Split-complementary colors use the two neighbors of the complement for a softer contrast.