#2788AC#2788AC
#2788AC is a mid, moderate cyan. Relative luminance 0.210; OKLCH L 58.8% C 0.102 H 227.8°. Best body text is #000000 at 5.20:1 contrast (WCAG AA passes).
Color values
| HEX | #2788AC |
|---|---|
| RGB | rgb(39, 136, 172) |
| HSL | hsl(196, 63%, 41%) |
| HSV | hsv(196, 77%, 67%) |
| CMYK | cmyk(77.3%, 20.9%, 0%, 32.5%) |
| CIE-LAB | lab(52.97, -15.10, -26.88) |
| CIE-LCH | lch(52.97, 30.83, 240.69°) |
| OKLab | oklab(58.81% -0.0684 -0.0755) |
| OKLCH | oklch(58.81% 0.102 227.8) |
| XYZ | xyz(17.0842, 21.0162, 42.1778) |
| Luminance | 0.2102 (WCAG relative) |
| Temperature | cool |
| Family | cyan |
Closest named colors
Dirty Blue
#3F829D
ΔE00 3.31
Cerulean
#007BA7
ΔE00 5.45
Teal Blue
#01889F
ΔE00 5.65
Nice Blue
#107AB0
ΔE00 7.34
Ocean
#017B92
ΔE00 7.38
Steel Blue
#4682B4
ΔE00 7.51
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#2788AC #AC4B27
analogous
#27AC8E #2788AC #2745AC
triadic
#2788AC #AC2788 #88AC27
tetradic
#2788AC #8E27AC #AC4B27 #45AC27
square
#2788AC #8E27AC #AC4B27 #45AC27
split-complementary
#2788AC #AC2745 #AC8E27
monochromatic
#103948 #1C617A #2788AC #3DAAD3 #6FC0DE
Accessibility & contrast
On white
4.04
#2788AC on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
5.20
#2788AC on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #2788AC
5.20:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##2788AC | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##2788AC | 1.00 | 4.04 | 5.20 | 5.20 |
| #FFFFFF | 4.04 | 1.00 | 21.00 | 21.00 |
| #000000 | 5.20 | 21.00 | 1.00 | 1.00 |
| ##000000 | 5.20 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#7586AE
Deuteranopia (green-blind)
#6379AC
Tritanopia (blue-blind)
#009294
Achromatopsia (no color)
#7E7E7E
Design tokens & code
CSS
--color: #2788ac; /* rgb */ color: rgb(39, 136, 172); /* oklch */ color: oklch(58.8% 0.102 227.8);
Tailwind
colors: {
custom: {
50: '#76aac5',
500: '#2788ac',
950: '#000000',
},
}SCSS
$custom: #2788ac; $custom-light: #76aac5; $custom-dark: #000000;
JSON
{
"hex": "#2788ac",
"rgb": {
"r": 39,
"g": 136,
"b": 172
},
"hsl": {
"h": 196.241,
"s": 63.033,
"l": 41.373
},
"oklch": {
"l": 0.58814,
"c": 0.10189,
"h": 227.8
},
"luminance": 0.21018
}Semantic roles & 50–950 ramp
primary
#2788AC
secondary
#C5826A
accent
#6E42E6
background
#F7FAFC
surface
#EEF4F8
border
#C9CED1
text
#0A1012
muted
#7C7F81