Color Companion

Analogous colour scheme

Neighbouring hues, thirty degrees either side — the safest way to build a palette.

#0ea5e9

A light, moderately saturated blue. Closest CSS name: `cornflowerblue`.

Hex
#0ea5e9
RGB
rgb(14 165 233)
HSL
hsl(198.6 88.7% 48.4%)
OKLCH
oklch(0.685 0.148 237.3)
CMYK
cmyk(93.99% 29.18% 0% 8.63%)
Nearest name
cornflowerblue

Readable text

White text

2.77:1

Black text

7.58:1

Use black text. Passes AA for normal text: yes · AAA: yes · AA for large text: yes

Worth knowing

  • Worth knowing

    6 derived colours are outside sRGB

    Rotating hue at this chroma produces colours a normal screen cannot display, so they have been clipped to the nearest sRGB colour. The hex values shown are therefore not exactly what the maths asked for, and the harmony will look slightly less even than it should.

    Fix: Lower the chroma of the input colour before deriving harmonies, or accept the clipped values as an approximation.

  • Note

    CMYK here is a naive conversion

    CMYK has no fixed meaning without an output profile — the same numbers print differently on different presses and papers. The value shown is the standard arithmetic conversion, not a colour-managed one.

    Fix: For print work, convert in software with the press profile applied.

Complementary — the opposite hue

  • complementary

    #dc7f2b

Analogous — neighbouring hues

  • analogous −30°

    #00b1c8

    clipped to sRGB

  • analogous +30°

    #7194f5

Triadic — evenly spaced

  • triadic +120°

    #e06f9a

  • triadic +240°

    #93a522

Split-complementary — softer opposites

  • split-complementary +150°

    #e77166

  • split-complementary +210°

    #c09200

    clipped to sRGB

Monochromatic — one hue, five lightnesses

  • lightness 0.25

    #00215e

    clipped to sRGB

  • lightness 0.4

    #004e8c

    clipped to sRGB

  • lightness 0.55

    #007bbc

    clipped to sRGB

  • lightness 0.7

    #1baaee

  • lightness 0.85

    #5fdbff

    clipped to sRGB

Try your own colour

Paste one on the home page — you can also pick a colour straight out of a photo there. This page is available as markdown.

Related examples