#42778F#42778F
#42778F is a mid, moderate cyan. Relative luminance 0.163; OKLCH L 54.2% C 0.068 H 229.2°. Best body text is #FFFFFF at 4.92:1 contrast (WCAG AA passes).
Color values
| HEX | #42778F |
|---|---|
| RGB | rgb(66, 119, 143) |
| HSL | hsl(199, 37%, 41%) |
| HSV | hsv(199, 54%, 56%) |
| CMYK | cmyk(53.8%, 16.8%, 0%, 43.9%) |
| CIE-LAB | lab(47.41, -10.52, -18.47) |
| CIE-LCH | lch(47.41, 21.26, 240.32°) |
| OKLab | oklab(54.23% -0.0443 -0.0513) |
| OKLCH | oklch(54.23% 0.068 229.2) |
| XYZ | xyz(13.7997, 16.3339, 28.4068) |
| Luminance | 0.1633 (WCAG relative) |
| Temperature | cool |
| Family | cyan |
Closest named colors
Dirty Blue
#3F829D
ΔE00 4.25
Sea Blue
#047495
ΔE00 4.52
Metallic Blue
#4F738E
ΔE00 4.56
Stormy Blue
#507B9C
ΔE00 5.37
Cerulean
#007BA7
ΔE00 5.74
Ocean
#017B92
ΔE00 5.91
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#42778F #8F5A42
analogous
#428F80 #42778F #42508F
triadic
#42778F #8F4277 #778F42
tetradic
#42778F #80428F #8F5A42 #508F42
square
#42778F #80428F #8F5A42 #508F42
split-complementary
#42778F #8F4250 #8F8042
monochromatic
#1B313B #2F5465 #42778F #5B98B3 #85B2C7
Accessibility & contrast
On white
4.92
#42778F on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
4.27
#42778F on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #42778F
4.92:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##42778F | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##42778F | 1.00 | 4.92 | 4.27 | 4.92 |
| #FFFFFF | 4.92 | 1.00 | 21.00 | 1.00 |
| #000000 | 4.27 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 4.92 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#6B7590
Deuteranopia (green-blind)
#606D8F
Tritanopia (blue-blind)
#107E7F
Achromatopsia (no color)
#707070
Design tokens & code
CSS
--color: #42778f; /* rgb */ color: rgb(66, 119, 143); /* oklch */ color: oklch(54.2% 0.068 229.2);
Tailwind
colors: {
custom: {
50: '#7c9eaf',
500: '#42778f',
950: '#000000',
},
}SCSS
$custom: #42778f; $custom-light: #7c9eaf; $custom-dark: #000000;
JSON
{
"hex": "#42778f",
"rgb": {
"r": 66,
"g": 119,
"b": 143
},
"hsl": {
"h": 198.701,
"s": 36.842,
"l": 40.98
},
"oklch": {
"l": 0.54231,
"c": 0.06781,
"h": 229.2
},
"luminance": 0.16335
}Semantic roles & 50–950 ramp
primary
#42778F
secondary
#B18C7B
accent
#7E5BCD
background
#F7F9FA
surface
#EEF2F4
border
#C9CCCE
text
#0A0E10
muted
#7C7E7F