Interactive Color Wheel
Drag the marker to explore hues and saturations. Harmony markers update live, and every swatch carries HEX, RGB, and CMYK with print gamut warnings.
Three hues evenly spaced — vibrant but balanced.
Color tools
More free color tools
Palettes, gradients, accessibility checks, and print-ready conversions — all in one place.
- Color Palette Generator
Generate harmonious palettes from one color — complementary, triadic, analogous, and more. CMYK values and print gamut warnings included.
- CSS Gradient Generator
Build linear, radial, and conic CSS gradients with live preview. Copy production-ready code instantly.
- WCAG Contrast Checker
Check color contrast ratios against WCAG 2.1 AA and AAA. Includes palette matrix mode and auto-fix suggestions.
- Tint & Shade Generator
Turn one brand color into a Tailwind-compatible 50–950 scale with WCAG contrast badges on every swatch.
- Palette from Image
Extract dominant colors from any photo — runs entirely in your browser. Send colors to converters or palette tools.
- Color Blindness Simulator
Preview palettes as seen with protanopia, deuteranopia, or tritanopia. Essential for accessible design.
- Print Gamut Checker
See exactly how a screen color shifts when printed in CMYK. Side-by-side press preview with shift warnings.
- Compare Colors (Delta E)
Measure the perceptual difference between two colors with ΔE2000 — plus HEX, RGB, CMYK, and HSL values for both.
New to color relationships? Start with our color theory guide, then refine your picks in the palette generator or audit them with the WCAG contrast checker.
FAQ
Frequently asked questions
Common questions about this tool.
- How do I use a color wheel to pick colors?
- Pick a base hue on the wheel, then apply a harmony rule: complementary (opposite), analogous (neighbors), or triadic (three evenly spaced hues). The markers show where each harmony color sits on the wheel.
- What do the wheel markers mean?
- The large marker is your base color. Smaller markers show the harmony colors generated by the selected scheme — their angle is the hue, their distance from center is the saturation.
- Can I send wheel colors to other tools?
- Yes. Open the current scheme in the palette generator to lock and refine swatches, or send all colors straight to the gradient generator.
- Why do some swatches show a CMYK warning?
- Saturated screen colors can sit outside the CMYK print gamut. The warning badge means the color will shift on press — check it in the HEX to CMYK converter before production.