#197BA1#197BA1
#197BA1 is a mid, moderate cyan. Relative luminance 0.169; OKLCH L 54.8% C 0.102 H 230.3°. Best body text is #FFFFFF at 4.78:1 contrast (WCAG AA passes).
Color values
| HEX | #197BA1 |
|---|---|
| RGB | rgb(25, 123, 161) |
| HSL | hsl(197, 73%, 36%) |
| HSV | hsv(197, 84%, 63%) |
| CMYK | cmyk(84.5%, 23.6%, 0%, 36.9%) |
| CIE-LAB | lab(48.19, -13.16, -27.94) |
| CIE-LCH | lch(48.19, 30.89, 244.78°) |
| OKLab | oklab(54.76% -0.0653 -0.0787) |
| OKLCH | oklch(54.76% 0.102 230.3) |
| XYZ | xyz(13.9142, 16.9440, 36.2485) |
| Luminance | 0.1695 (WCAG relative) |
| Temperature | cool |
| Family | cyan |
Closest named colors
Cerulean
#007BA7
ΔE00 1.51
Sea Blue
#047495
ΔE00 3.34
Ocean Blue (survey)
#03719C
ΔE00 4.05
Dirty Blue
#3F829D
ΔE00 4.43
Nice Blue
#107AB0
ΔE00 4.46
Ocean
#017B92
ΔE00 6.04
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#197BA1 #A13F19
analogous
#19A183 #197BA1 #1937A1
triadic
#197BA1 #A1197B #7BA119
tetradic
#197BA1 #8319A1 #A13F19 #37A119
square
#197BA1 #8319A1 #A13F19 #37A119
split-complementary
#197BA1 #A11937 #A18319
monochromatic
#092A37 #11536C #197BA1 #21A3D6 #50BBE4
Accessibility & contrast
On white
4.78
#197BA1 on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
4.39
#197BA1 on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #197BA1
4.78:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##197BA1 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##197BA1 | 1.00 | 4.78 | 4.39 | 4.78 |
| #FFFFFF | 4.78 | 1.00 | 21.00 | 1.00 |
| #000000 | 4.39 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 4.78 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#6779A3
Deuteranopia (green-blind)
#566DA0
Tritanopia (blue-blind)
#008588
Achromatopsia (no color)
#727272
Design tokens & code
CSS
--color: #197ba1; /* rgb */ color: rgb(25, 123, 161); /* oklch */ color: oklch(54.8% 0.102 230.3);
Tailwind
colors: {
custom: {
50: '#6fa1bd',
500: '#197ba1',
950: '#000000',
},
}SCSS
$custom: #197ba1; $custom-light: #6fa1bd; $custom-dark: #000000;
JSON
{
"hex": "#197ba1",
"rgb": {
"r": 25,
"g": 123,
"b": 161
},
"hsl": {
"h": 196.765,
"s": 73.118,
"l": 36.471
},
"oklch": {
"l": 0.5476,
"c": 0.10229,
"h": 230.3
},
"luminance": 0.16946
}Semantic roles & 50–950 ramp
primary
#197BA1
secondary
#C6714F
accent
#6B38F0
background
#F7F9FB
surface
#EDF2F6
border
#C8CCD0
text
#090F12
muted
#7B7E81