239°
100%
#6366f1Current Color
R
G
B
H
S
L
My Palette0 colors

Color Harmony

#6366f1
#f2ef64

Shades

Tints

How It Works

1

Pick Your Color

Use the spectrum picker, color wheel, or paste any color code.

2

Build Your Palette

Add colors to your palette, generate harmonies, check contrast, and create gradients. Lock colors you like and shuffle the rest.

3

Export Anywhere

Copy in any format, export as CSS variables, Tailwind config, SCSS, or JSON. Everything happens in your browser.

Powerful Features

100% Private

All processing happens locally. No uploads, no servers, no tracking.

14+ Color Formats

HEX, RGB, HSL, HSV, CMYK, LAB, LCH, OKLAB, OKLCH, HWB and more.

Accessibility Tools

WCAG & APCA contrast checking, color blindness simulation.

Color Harmonies

Complementary, analogous, triadic, tetradic and more schemes.

Frequently Asked Questions

Is my data private?
Yes, 100%. All color processing happens entirely in your browser using JavaScript. No data is ever sent to any server. We don't track, store, or transmit anything.
What color formats are supported?
We support 14+ color formats: HEX, HEX8 (with alpha), RGB, RGBA, HSL, HSLA, HSV, HWB, CMYK, LAB, LCH, OKLAB, and OKLCH. You can input and output in any format.
What is WCAG contrast?
WCAG (Web Content Accessibility Guidelines) defines minimum contrast ratios for text readability. AA requires 4.5:1 for normal text and 3:1 for large text. AAA requires 7:1 and 4.5:1 respectively.
What is APCA?
APCA (Advanced Perceptual Contrast Algorithm) is a modern contrast calculation method that better models human perception. It's being considered for WCAG 3.0 and provides more accurate results for real-world readability.

How It Works

1

Pick Your Color

Use the spectrum picker, color wheel, or paste any color code.

2

Build Your Palette

Add colors to your palette, generate harmonies, check contrast, and create gradients. Lock colors you like and shuffle the rest.

3

Export Anywhere

Copy in any format, export as CSS variables, Tailwind config, SCSS, or JSON. Everything happens in your browser.

Powerful Features

100% Private

All processing happens locally. No uploads, no servers, no tracking.

14+ Color Formats

HEX, RGB, HSL, HSV, CMYK, LAB, LCH, OKLAB, OKLCH, HWB and more.

Accessibility Tools

WCAG & APCA contrast checking, color blindness simulation.

Color Harmonies

Complementary, analogous, triadic, tetradic and more schemes.

Frequently Asked Questions

Is my data private?
Yes, 100%. All color processing happens entirely in your browser using JavaScript. No data is ever sent to any server. We don't track, store, or transmit anything.
What color formats are supported?
We support 14+ color formats: HEX, HEX8 (with alpha), RGB, RGBA, HSL, HSLA, HSV, HWB, CMYK, LAB, LCH, OKLAB, and OKLCH. You can input and output in any format.
What is WCAG contrast?
WCAG (Web Content Accessibility Guidelines) defines minimum contrast ratios for text readability. AA requires 4.5:1 for normal text and 3:1 for large text. AAA requires 7:1 and 4.5:1 respectively.
What is APCA?
APCA (Advanced Perceptual Contrast Algorithm) is a modern contrast calculation method that better models human perception. It's being considered for WCAG 3.0 and provides more accurate results for real-world readability.