#5FB7CA#5FB7CA
#5FB7CA is a light, moderate cyan. Relative luminance 0.406; OKLCH L 73.2% C 0.089 H 213.5°. Best body text is #000000 at 9.11:1 contrast (WCAG AA passes).
Color values
| HEX | #5FB7CA |
|---|---|
| RGB | rgb(95, 183, 202) |
| HSL | hsl(191, 50%, 58%) |
| HSV | hsv(191, 53%, 79%) |
| CMYK | cmyk(53%, 9.4%, 0%, 20.8%) |
| CIE-LAB | lab(69.87, -21.17, -17.72) |
| CIE-LCH | lch(69.87, 27.60, 219.93°) |
| OKLab | oklab(73.2% -0.0739 -0.049) |
| OKLCH | oklch(73.2% 0.089 213.5) |
| XYZ | xyz(32.3093, 40.5612, 61.9921) |
| Luminance | 0.4056 (WCAG relative) |
| Temperature | cool |
| Family | cyan |
Closest named colors
Turquoise Blue
#06B1C4
ΔE00 5.22
Sky Blue
#87CEEB
ΔE00 8.32
Greyblue
#77A1B5
ΔE00 9.11
Bright Sky Blue
#02CCFE
ΔE00 9.34
Baby Blue
#89CFF0
ΔE00 9.40
Cadetblue
#5F9EA0
ΔE00 9.54
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#5FB7CA #CA725F
analogous
#5FCAA7 #5FB7CA #5F81CA
triadic
#5FB7CA #CA5FB7 #B7CA5F
tetradic
#5FB7CA #A75FCA #CA725F #81CA5F
square
#5FB7CA #A75FCA #CA725F #81CA5F
split-complementary
#5FB7CA #CA5F81 #CAA75F
monochromatic
#2B7483 #3B9CB1 #5FB7CA #8DCCD9 #BBE0E8
Accessibility & contrast
On white
2.30
#5FB7CA on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
9.11
#5FB7CA on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #5FB7CA
9.11:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##5FB7CA | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##5FB7CA | 1.00 | 2.30 | 9.11 | 9.11 |
| #FFFFFF | 2.30 | 1.00 | 21.00 | 21.00 |
| #000000 | 9.11 | 21.00 | 1.00 | 1.00 |
| ##000000 | 9.11 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#A9B2CB
Deuteranopia (green-blind)
#98A5CA
Tritanopia (blue-blind)
#06BFBD
Achromatopsia (no color)
#ABABAB
Design tokens & code
CSS
--color: #5fb7ca; /* rgb */ color: rgb(95, 183, 202); /* oklch */ color: oklch(73.2% 0.089 213.5);
Tailwind
colors: {
custom: {
50: '#94ccda',
500: '#5fb7ca',
950: '#000000',
},
}SCSS
$custom: #5fb7ca; $custom-light: #94ccda; $custom-dark: #000000;
JSON
{
"hex": "#5fb7ca",
"rgb": {
"r": 95,
"g": 183,
"b": 202
},
"hsl": {
"h": 190.654,
"s": 50.235,
"l": 58.235
},
"oklch": {
"l": 0.73197,
"c": 0.08867,
"h": 213.5
},
"luminance": 0.40564
}Semantic roles & 50–950 ramp
primary
#5FB7CA
secondary
#D8B5AD
accent
#674EDA
background
#F9FCFD
surface
#F2F9FA
border
#CCD2D3
text
#0E1314
muted
#7E8283