color palettes

A color is a starting point

Follow your color.

Convert a hex, explore its neighbors on the wheel, and take a complete harmony into the palette editor.

Enter hex, RGB channels (0–255 or %) or HSL (degrees, %, %). Alpha is handled in the contrast checker. RGB is exact for this hex. HSL and OKLCH are rounded for display. The wheel shows HSL hue; it is not perceptually uniform.

Your color, with company

A tonal scale to explore

Eleven OKLCH lightness steps, mapped into sRGB by reducing chroma where needed. These are candidate shades, not checked component roles. Edit and export named scales in the studio.

Try a different starting point

These names describe example colors. Navy, coral, olive and teal also have standardized CSS named-color values; sage, terracotta, lilac and cream can refer to many different shades. Keep the exact hex when communicating a choice.

Harmony is a relationship, not a guarantee.

The wheel uses hue angles to suggest combinations. It cannot decide which color should carry your text, whether a link is recognizable, or whether a status message is clear. Keep one dominant role, inspect the real layout, and measure the pairs that carry information. Color associations depend on context and audience; there is no universal “best” hue for a business.