#224286#224286

#224286 is a dark, vivid blue. Relative luminance 0.060; OKLCH L 39.5% C 0.120 H 263.1°. Best body text is #FFFFFF at 9.58:1 contrast (WCAG AA passes).

Color values

HEX	#224286
RGB	rgb(34, 66, 134)
HSL	hsl(221, 60%, 33%)
HSV	hsv(221, 75%, 53%)
CMYK	cmyk(74.6%, 50.7%, 0%, 47.5%)
CIE-LAB	lab(29.30, 13.40, -41.58)
CIE-LCH	lch(29.30, 43.68, 287.86°)
OKLab	oklab(39.51% -0.0145 -0.1194)
OKLCH	oklch(39.51% 0.12 263.1)
XYZ	xyz(6.9094, 5.9570, 23.3353)
Luminance	0.0596 (WCAG relative)
Temperature	cool
Family	blue

Closest named colors

Perceptual scales

Shades

Tints

Tones

OKLCH scale

Color harmonies

complementary

#224286 #866622

analogous

#227486 #224286 #342286

triadic

#224286 #862242 #428622

tetradic

#224286 #862274 #866622 #228634

square

#224286 #862274 #866622 #228634

split-complementary

#224286 #863422 #748622

monochromatic

#091224 #162A55 #224286 #2E5AB7 #507AD3

Accessibility & contrast

On white

9.58

#224286 on #FFFFFF

AA ✓AA large ✓AAA ✓

On black

2.19

#224286 on #000000

AA ✗AA large ✗AAA ✗

Best text color

#FFFFFF on #224286

9.58:1 — WCAG AA (normal text) passes

Contrast matrix

fg \ bg	##224286	#FFFFFF	#000000	##FFFFFF
##224286	1.00	9.58	2.19	9.58
#FFFFFF	9.58	1.00	21.00	1.00
#000000	2.19	21.00	1.00	21.00
##FFFFFF	9.58	1.00	21.00	1.00

Color blindness preview

Protanopia (red-blind)

#1B4A88

Deuteranopia (green-blind)

#004185

Tritanopia (blue-blind)

#00525D

Achromatopsia (no color)

#454545

Design tokens & code

CSS

--color: #224286;
/* rgb */ color: rgb(34, 66, 134);
/* oklch */ color: oklch(39.5% 0.120 263.1);

Tailwind

colors: {
  custom: {
    50: '#6b75aa',
    500: '#224286',
    950: '#000000',
  },
}

SCSS

$custom: #224286;
$custom-light: #6b75aa;
$custom-dark: #000000;

JSON

{
  "hex": "#224286",
  "rgb": {
    "r": 34,
    "g": 66,
    "b": 134
  },
  "hsl": {
    "h": 220.8,
    "s": 59.524,
    "l": 32.941
  },
  "oklch": {
    "l": 0.39513,
    "c": 0.12027,
    "h": 263.1
  },
  "luminance": 0.05958
}

Semantic roles & 50–950 ramp

primary

#224286

secondary

#B6954E

accent

#B045E3

background

#F6F7FA

surface

#ECEDF4

border

#C7C8CE

text

#080810

muted

#7A7B7F

Preview Lab

Preview with #224286

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

Preview Lab → · Contrast checker → · Palette generator →