Color Picker & Color Code Converter (HEX, RGB, CMYK, HSV, HSL, Contrast)

HEX

RGB

255, 255, 255

CMYK

0%, 0%, 0%, 0%

HSV

0°, 0%, 100%

HSL

0°, 0%, 100%

WCAG 2.1 Accessibility & Contrast Checker

White Text (#FFFFFF)1:1

Normal 16pxBold 16pxLarge 24px

Normal text (<18pt): Fail Large text (≥18pt): Fail

Black Text (#000000)21:1

Normal 16pxBold 16pxLarge 24px

Normal text (<18pt): Pass (AAA) Large text (≥18pt): Pass (AAA)

Harmonic Color Palettes

Complementary

Analogous

Triadic

Tetradic

Split-Complementary

Monochromatic

Color Presets & Swatch Libraries

Material UI

Tailwind CSS

Web Safe

Recently Selected Swatches

No colors chosen yet.

CSS & Code Formats

HEX

#ffffff

CSS RGB / RGBA

rgb(255, 255, 255)

CSS HSL / HSLA

hsl(0, 0%, 100%)

Print CMYK

cmyk(0%, 0%, 0%, 0%)

Deep Dive: Color Models, Encodings & Accessibility Guide

1. HEX (Hexadecimal) Color Format

HEX notation is the cornerstone of modern web styling. Written as a hash (#) followed by six hexadecimal digits (RRGGBB), each pair ranges from 00 (0) to FF (255). An 8-digit HEX code (#RRGGBBAA) appends a two-digit alpha transparency channel.

2. RGB & RGBA (Additive Light Model)

RGB represents colors produced by digital emissive screens. Values range from 0 to 255 for Red, Green, and Blue. When all channels are 255, the result is pure white (rgb(255, 255, 255)). RGBA extends this with an alpha opacity value between 0.0 and 1.0.

3. CMYK (Subtractive Pigment Model)

CMYK uses Cyan, Magenta, Yellow, and Key (Black) inks for high-fidelity physical printing. Expressed in percentages (0-100%), inks subtract light bouncing off white paper.

4. HSV & HSL (Human Perception Systems)

Hue (0°-360°), Saturation (0%-100%), and Value / Lightness (0%-100%) make color selection and harmony tuning intuitive for designers and developers.

5. WCAG 2.1 Contrast Standards & Accessibility

Ensuring readable content is vital for digital accessibility. Level AA requires at least 4.5:1 contrast for normal text and 3:1 for large text (≥18pt or 14pt bold). Level AAA demands 7:1 for normal text and 4.5:1 for large text.