833 colors · mix · gradient ·
suggestImage & Color
Dive deep into color theory with the Color Explorer. Enter any base color to instantly
generate harmonious palettes, smooth gradients, tints, and shades.
Try:
833 colors
—
Add colors and weights to mix
Click to copy CSS
Type
Angle
Shape
Repeatrepeating-${type}-gradient
Stops
Click preview or CSS to copy
Advertisement
Encyclopedia
833 named colors. Search by name or hex code. Click any swatch to see Hex, RGB, HSL,
HSB, CMYK values plus WCAG contrast ratios. Click any value row to copy it.
Mixer
Add as many color slots as you want. Type a name or hex code in each slot. Set a weight
(0–100) per slot — the tool normalises automatically. Two modes: RGB Mix (additive, like light)
and Pigment Mix (subtractive, like paint).
Gradient
Build linear, radial, or conic gradients. Add/remove color stops, set positions (%).
Enable repeating gradients. Click the preview or CSS output to copy the full background
declaration.
Suggest
Choose from 30 project types. Get 3 curated palettes per type with color-theory
reasoning explaining why these colors work. Click any swatch to copy its hex. Copy all 5 hex values at once.
Color Values
HEX — 6-digit web hex. RGB — red/green/blue 0–255.
HSL — hue/saturation/lightness. HSB/HSV — hue/saturation/brightness.
CMYK — cyan/magenta/yellow/key used in print.
WCAG Contrast
Each color shows its contrast ratio against white and black text. AA requires 4.5:1, AAA
requires 7:1 for normal text. Green badge = pass, red badge = fail.
Advertisement
How to use
Open the tool and enter your data or select options.
Adjust settings to see real-time updates.
Copy the generated result to your clipboard.
Frequently Asked Questions
What is the difference between a tint and a
shade?
A
tint is a mixture of a color with white, which increases lightness. A shade is a mixture with black, which
increases darkness.
What are complementary colors?
Complementary colors are pairs of colors which, when combined or mixed, cancel each other out. On the
traditional color wheel, they are opposite each other.
Can I export the palettes?
Yes,
you can click on any generated color swatch to instantly copy its HEX code.
Did you know?
Sir Isaac Newton developed the first circular diagram of colors in 1666.
The human eye can distinguish approximately 10 million different colors.
Digital screens use the RGB color model, which is an additive model where red, green, and blue light are added
together to produce white.