#255BA8#255BA8
#255BA8 is a mid, vivid blue. Relative luminance 0.107; OKLCH L 47.8% C 0.136 H 257.9°. Best body text is #FFFFFF at 6.69:1 contrast (WCAG AA passes).
Color values
| HEX | #255BA8 |
|---|---|
| RGB | rgb(37, 91, 168) |
| HSL | hsl(215, 64%, 40%) |
| HSV | hsv(215, 78%, 66%) |
| CMYK | cmyk(78%, 45.8%, 0%, 34.1%) |
| CIE-LAB | lab(39.07, 10.41, -46.47) |
| CIE-LCH | lch(39.07, 47.62, 282.63°) |
| OKLab | oklab(47.78% -0.0286 -0.1333) |
| OKLCH | oklch(47.78% 0.136 257.9) |
| XYZ | xyz(11.5693, 10.7013, 38.4940) |
| Luminance | 0.1070 (WCAG relative) |
| Temperature | cool |
| Family | blue |
Closest named colors
Denim
#1560BD
ΔE00 2.88
Denim Blue
#3B5B92
ΔE00 3.52
Light Navy Blue
#2E5A88
ΔE00 3.83
Sapphire
#0F52BA
ΔE00 3.90
Dusk Blue
#26538D
ΔE00 3.99
Denim (survey)
#3B638C
ΔE00 4.53
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#255BA8 #A87225
analogous
#259CA8 #255BA8 #3025A8
triadic
#255BA8 #A8255B #5BA825
tetradic
#255BA8 #A8259C #A87225 #25A830
square
#255BA8 #A8259C #A87225 #25A830
split-complementary
#255BA8 #A83025 #9CA825
monochromatic
#0F2544 #1A4076 #255BA8 #3777D3 #6999DE
Accessibility & contrast
On white
6.69
#255BA8 on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.14
#255BA8 on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #255BA8
6.69:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##255BA8 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##255BA8 | 1.00 | 6.69 | 3.14 | 6.69 |
| #FFFFFF | 6.69 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.14 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 6.69 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#3362AB
Deuteranopia (green-blind)
#1556A6
Tritanopia (blue-blind)
#006D79
Achromatopsia (no color)
#5C5C5C
Design tokens & code
CSS
--color: #255ba8; /* rgb */ color: rgb(37, 91, 168); /* oklch */ color: oklch(47.8% 0.136 257.9);
Tailwind
colors: {
custom: {
50: '#7388c2',
500: '#255ba8',
950: '#000000',
},
}SCSS
$custom: #255ba8; $custom-light: #7388c2; $custom-dark: #000000;
JSON
{
"hex": "#255ba8",
"rgb": {
"r": 37,
"g": 91,
"b": 168
},
"hsl": {
"h": 215.267,
"s": 63.902,
"l": 40.196
},
"oklch": {
"l": 0.47783,
"c": 0.13629,
"h": 257.9
},
"luminance": 0.10703
}Semantic roles & 50–950 ramp
primary
#255BA8
secondary
#C49D65
accent
#A241E7
background
#F7F8FC
surface
#EEEFF8
border
#C9CAD1
text
#090B12
muted
#7B7C81