#253F96#253F96
#253F96 is a dark, vivid blue. Relative luminance 0.061; OKLCH L 40.3% C 0.146 H 266.9°. Best body text is #FFFFFF at 9.42:1 contrast (WCAG AA passes).
Color values
| HEX | #253F96 |
|---|---|
| RGB | rgb(37, 63, 150) |
| HSL | hsl(226, 60%, 37%) |
| HSV | hsv(226, 75%, 59%) |
| CMYK | cmyk(75.3%, 58%, 0%, 41.2%) |
| CIE-LAB | lab(29.79, 22.16, -50.63) |
| CIE-LCH | lch(29.79, 55.27, 293.64°) |
| OKLab | oklab(40.3% -0.0079 -0.146) |
| OKLCH | oklch(40.3% 0.146 266.9) |
| XYZ | xyz(8.0436, 6.1495, 29.6113) |
| Luminance | 0.0615 (WCAG relative) |
| Temperature | cool |
| Family | blue |
Closest named colors
Sapphire (survey)
#2138AB
ΔE00 4.17
Cobalt (survey)
#1E488F
ΔE00 4.22
Cobalt
#0047AB
ΔE00 4.30
Blueberry
#464196
ΔE00 5.20
Darkish Blue
#014182
ΔE00 5.49
Twilight Blue
#0A437A
ΔE00 6.58
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#253F96 #967C25
analogous
#257896 #253F96 #442596
triadic
#253F96 #96253F #3F9625
tetradic
#253F96 #962578 #967C25 #259644
square
#253F96 #962578 #967C25 #259644
split-complementary
#253F96 #964425 #789625
monochromatic
#0D1634 #192A65 #253F96 #3154C7 #5E7AD7
Accessibility & contrast
On white
9.42
#253F96 on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.23
#253F96 on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #253F96
9.42:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##253F96 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##253F96 | 1.00 | 9.42 | 2.23 | 9.42 |
| #FFFFFF | 9.42 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.23 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 9.42 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#004C99
Deuteranopia (green-blind)
#004194
Tritanopia (blue-blind)
#005564
Achromatopsia (no color)
#464646
Design tokens & code
CSS
--color: #253f96; /* rgb */ color: rgb(37, 63, 150); /* oklch */ color: oklch(40.3% 0.146 266.9);
Tailwind
colors: {
custom: {
50: '#7073b6',
500: '#253f96',
950: '#000000',
},
}SCSS
$custom: #253f96; $custom-light: #7073b6; $custom-dark: #000000;
JSON
{
"hex": "#253f96",
"rgb": {
"r": 37,
"g": 63,
"b": 150
},
"hsl": {
"h": 226.195,
"s": 60.428,
"l": 36.667
},
"oklch": {
"l": 0.40297,
"c": 0.14625,
"h": 266.9
},
"luminance": 0.0615
}Semantic roles & 50–950 ramp
primary
#253F96
secondary
#BCA65B
accent
#BF44E4
background
#F7F6FB
surface
#EDECF6
border
#C8C7D0
text
#090811
muted
#7B7B80