Find a complementary colour
The opposite hue, rotated in OKLCH so the pair keeps the same perceived lightness instead of one looking washed out.
#e11d48
A mid-tone, vivid orange. Closest CSS name: `crimson`.
- Hex
- #e11d48
- RGB
- rgb(225 29 72)
- HSL
- hsl(346.8 77.2% 49.8%)
- OKLCH
- oklch(0.586 0.222 17.6)
- CMYK
- cmyk(0% 87.11% 68% 11.76%)
- Nearest name
- crimson
Readable text
White text
4.7:1
Black text
4.47:1
Use white text. Passes AA for normal text: yes · AAA: no · AA for large text: yes
Worth knowing
Worth knowing
11 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.
Worth knowing
A mid-tone: neither white nor black text reaches AAA
The best this colour manages is 4.7:1 — against white text. That clears WCAG AA for normal text (4.5:1) but not AAA (7:1). Mid-tones look fine in a mockup and then fail review, because both text colours are only just adequate.
Fix: Use white text on it, and move the lightness further from the middle if the text has to meet AAA.
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
#009eaa
clipped to sRGB
Analogous — neighbouring hues
analogous −30°
#d12894
analogous +30°
#dc3900
clipped to sRGB
Triadic — evenly spaced
triadic +120°
#1f9700
clipped to sRGB
triadic +240°
#0074fb
clipped to sRGB
Split-complementary — softer opposites
split-complementary +150°
#00a160
clipped to sRGB
split-complementary +210°
#008de0
clipped to sRGB
Monochromatic — one hue, five lightnesses
lightness 0.25
#670000
clipped to sRGB
lightness 0.4
#9d0013
clipped to sRGB
lightness 0.55
#d4003e
clipped to sRGB
lightness 0.7
#ff5069
clipped to sRGB
lightness 0.85
#ff8597
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.