Skip to content

Color Palette Generator

Build color palettes from a base color with color-wheel harmonies, with HEX, RGB and HSL values.

HEX, RGB or HSL

  • Aa 5.5:1
    HEX
    #FF1A3C
    RGB
    rgb(255, 26, 60)
    HSL
    hsl(351, 100%, 55%)
  • Aa 7.4:1
    HEX
    #FF6B1A
    RGB
    rgb(255, 107, 26)
    HSL
    hsl(21, 100%, 55%)
  • Aa 15.6:1
    HEX
    #FFDD1A
    RGB
    rgb(255, 221, 26)
    HSL
    hsl(51, 100%, 55%)

Runs in your browser — nothing you enter is sent to a server.

How the Color Palette Generator works

Choose a base color — type it, pick it, or select Random — and a harmony. The generator turns the hue around the color wheel while keeping the saturation and lightness, so the colors feel like a set. Monochromatic shades keep the hue and change the lightness instead.

Each swatch shows HEX, RGB and HSL values and whether black or white text reads better on it, with the WCAG contrast ratio (4.5:1 or more is readable for normal text). Copy single colors or the whole palette as CSS variables or JSON.

Formula

complementary +180° · analogous ±30° · triadic +120°, +240° · split complementary +150°, +210° · tetradic +90°, +180°, +270°

Examples

Complementary red

#FF0000 and #00FFFF (cyan).

Triadic red

#FF0000, #00FF00 and #0000FF.

Frequently asked questions

Which harmony should I use?

Analogous and monochromatic palettes are calm and easy to use. Complementary and triadic ones have more contrast — use one color as the main one and the others as accents.

Why check contrast?

Text needs enough contrast with its background to be readable, especially for people with low vision. WCAG asks for at least 4.5:1 for normal text.

Can I convert a palette color to other formats?

Yes — paste it into the Color Converter for CMYK and HSV too.

Related tools

Color Converter

Convert colors between HEX, RGB, HSL, HSV and CMYK, and check their contrast against white and black.

Converters

CSS Minifier

Minify CSS to make it smaller, or beautify minified CSS to make it readable.

Developer Tools

Random String Generator

Generate random strings from letters, digits, hex, URL-safe characters or your own set, in bulk.

Generators

Also in Tools for Website Owners.