#220B31#220B31

#220B31 is a very dark, moderate violet. Relative luminance 0.008; OKLCH L 20.9% C 0.074 H 309.2°. Best body text is #FFFFFF at 18.10:1 contrast (WCAG AA passes).

Color values

HEX#220B31
RGBrgb(34, 11, 49)
HSLhsl(276, 63%, 12%)
HSVhsv(276, 78%, 19%)
CMYKcmyk(30.6%, 77.6%, 0%, 80.8%)
CIE-LABlab(7.24, 20.44, -20.27)
CIE-LCHlch(7.24, 28.78, 315.23°)
OKLaboklab(20.9% 0.0469 -0.0574)
OKLCHoklch(20.9% 0.074 309.2)
XYZxyz(1.3336, 0.8012, 2.9895)
Luminance0.0080 (WCAG relative)
Temperaturecool
Familyviolet

Closest named colors

Perceptual scales

Shades

Tints

Tones

OKLCH scale

Color harmonies

complementary
#220B31 #1A310B
analogous
#0F0B31 #220B31 #310B2D
triadic
#220B31 #31220B #0B3122
tetradic
#220B31 #310F0B #1A310B #0B2D31
square
#220B31 #310F0B #1A310B #0B2D31
split-complementary
#220B31 #2D310B #0B310F
monochromatic
#110619 #110619 #220B31 #451663 #672195

Accessibility & contrast

On white

18.10
#220B31 on #FFFFFF
AA ✓AA large ✓AAA ✓

On black

1.16
#220B31 on #000000
AA ✗AA large ✗AAA ✗

Best text color

#FFFFFF on #220B31
18.10:1 — WCAG AA (normal text) passes

Contrast matrix

fg \ bg##220B31#FFFFFF#000000##FFFFFF
##220B311.0018.101.1618.10
#FFFFFF18.101.0021.001.00
#0000001.1621.001.0021.00
##FFFFFF18.101.0021.001.00

Color blindness preview

Protanopia (red-blind)
#001532
Deuteranopia (green-blind)
#061630
Tritanopia (blue-blind)
#20131C
Achromatopsia (no color)
#161616

Design tokens & code

CSS
--color: #220b31;
/* rgb */ color: rgb(34, 11, 49);
/* oklch */ color: oklch(20.9% 0.074 309.2);
Tailwind
colors: {
  custom: {
    50: '#5f4b69',
    500: '#220b31',
    950: '#000000',
  },
}
SCSS
$custom: #220b31;
$custom-light: #5f4b69;
$custom-dark: #000000;
JSON
{
  "hex": "#220b31",
  "rgb": {
    "r": 34,
    "g": 11,
    "b": 49
  },
  "hsl": {
    "h": 276.316,
    "s": 63.333,
    "l": 11.765
  },
  "oklch": {
    "l": 0.20903,
    "c": 0.07408,
    "h": 309.2
  },
  "luminance": 0.00801
}

Semantic roles & 50–950 ramp

primary
#220B31
secondary
#456E2A
accent
#E64183
background
#F5F4F6
surface
#E9E7EB
border
#C5C3C6
text
#050106
muted
#79777A

Preview Lab

Preview with #220B31

Body copy rendered with the generated semantic roles for this colour.

Preview Lab → · Contrast checker → · Palette generator →

#220B31 Color — HEX, RGB, HSL, OKLCH & Contrast — Tintiva