#2C76A5#2C76A5
#2C76A5 is a mid, moderate cyan. Relative luminance 0.162; OKLCH L 54.2% C 0.103 H 240.6°. Best body text is #FFFFFF at 4.95:1 contrast (WCAG AA passes).
Color values
| HEX | #2C76A5 |
|---|---|
| RGB | rgb(44, 118, 165) |
| HSL | hsl(203, 58%, 41%) |
| HSV | hsv(203, 73%, 65%) |
| CMYK | cmyk(73.3%, 28.5%, 0%, 35.3%) |
| CIE-LAB | lab(47.25, -6.64, -31.72) |
| CIE-LCH | lch(47.25, 32.41, 258.18°) |
| OKLab | oklab(54.19% -0.0505 -0.0896) |
| OKLCH | oklch(54.19% 0.103 240.6) |
| XYZ | xyz(14.3060, 16.2073, 37.9644) |
| Luminance | 0.1621 (WCAG relative) |
| Temperature | cool |
| Family | cyan |
Closest named colors
Nice Blue
#107AB0
ΔE00 2.18
Muted Blue
#3B719F
ΔE00 3.07
Flat Blue
#3C73A8
ΔE00 3.63
Ocean Blue (survey)
#03719C
ΔE00 3.70
Dull Blue
#49759C
ΔE00 3.81
Cerulean
#007BA7
ΔE00 3.88
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#2C76A5 #A55B2C
analogous
#2CA597 #2C76A5 #2C39A5
triadic
#2C76A5 #A52C76 #76A52C
tetradic
#2C76A5 #972CA5 #A55B2C #39A52C
square
#2C76A5 #972CA5 #A55B2C #39A52C
split-complementary
#2C76A5 #A52C39 #A5972C
monochromatic
#123144 #1F5375 #2C76A5 #4297CD #72B1D9
Accessibility & contrast
On white
4.95
#2C76A5 on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
4.24
#2C76A5 on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #2C76A5
4.95:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##2C76A5 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##2C76A5 | 1.00 | 4.95 | 4.24 | 4.95 |
| #FFFFFF | 4.95 | 1.00 | 21.00 | 1.00 |
| #000000 | 4.24 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 4.95 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#6076A7
Deuteranopia (green-blind)
#506BA4
Tritanopia (blue-blind)
#008286
Achromatopsia (no color)
#707070
Design tokens & code
CSS
--color: #2c76a5; /* rgb */ color: rgb(44, 118, 165); /* oklch */ color: oklch(54.2% 0.103 240.6);
Tailwind
colors: {
custom: {
50: '#759dc0',
500: '#2c76a5',
950: '#000000',
},
}SCSS
$custom: #2c76a5; $custom-light: #759dc0; $custom-dark: #000000;
JSON
{
"hex": "#2c76a5",
"rgb": {
"r": 44,
"g": 118,
"b": 165
},
"hsl": {
"h": 203.306,
"s": 57.895,
"l": 40.98
},
"oklch": {
"l": 0.54189,
"c": 0.10287,
"h": 240.6
},
"luminance": 0.16209
}Semantic roles & 50–950 ramp
primary
#2C76A5
secondary
#C18D6C
accent
#8347E1
background
#F7F9FB
surface
#EEF2F7
border
#C9CCD0
text
#090E12
muted
#7B7E81