#BACCCE#BACCCE
#BACCCE is a very light, near-neutral teal. Relative luminance 0.581; OKLCH L 83.2% C 0.020 H 204.8°. Best body text is #000000 at 12.62:1 contrast (WCAG AA passes).
Color values
| HEX | #BACCCE |
|---|---|
| RGB | rgb(186, 204, 206) |
| HSL | hsl(186, 17%, 77%) |
| HSV | hsv(186, 10%, 81%) |
| CMYK | cmyk(9.7%, 1%, 0%, 19.2%) |
| CIE-LAB | lab(80.78, -5.68, -3.07) |
| CIE-LCH | lch(80.78, 6.46, 208.44°) |
| OKLab | oklab(83.22% -0.0179 -0.0083) |
| OKLCH | oklch(83.22% 0.02 204.8) |
| XYZ | xyz(52.9806, 58.0802, 66.7999) |
| Luminance | 0.5808 (WCAG relative) |
| Temperature | cool |
| Family | teal |
Closest named colors
Silver (survey)
#C5C9C7
ΔE00 5.61
Lightblue
#ADD8E6
ΔE00 7.45
Light Grey
#D8DCD6
ΔE00 7.63
Fog
#D8DCE0
ΔE00 7.69
Silver
#C0C0C0
ΔE00 7.82
Light Gray
#D3D3D3
ΔE00 7.94
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#BACCCE #CEBCBA
analogous
#BACEC6 #BACCCE #BAC2CE
triadic
#BACCCE #CEBACC #CCCEBA
tetradic
#BACCCE #C6BACE #CEBCBA #C2CEBA
square
#BACCCE #C6BACE #CEBCBA #C2CEBA
split-complementary
#BACCCE #CEBAC2 #CEC6BA
monochromatic
#72979B #96B2B5 #BACCCE #DEE6E7 #EDF2F2
Accessibility & contrast
On white
1.66
#BACCCE on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
12.62
#BACCCE on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #BACCCE
12.62:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##BACCCE | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##BACCCE | 1.00 | 1.66 | 12.62 | 12.62 |
| #FFFFFF | 1.66 | 1.00 | 21.00 | 21.00 |
| #000000 | 12.62 | 21.00 | 1.00 | 1.00 |
| ##000000 | 12.62 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#C9CACE
Deuteranopia (green-blind)
#C5C7CE
Tritanopia (blue-blind)
#B5CECD
Achromatopsia (no color)
#C8C8C8
Design tokens & code
CSS
--color: #baccce; /* rgb */ color: rgb(186, 204, 206); /* oklch */ color: oklch(83.2% 0.020 204.8);
Tailwind
colors: {
custom: {
50: '#cedbdc',
500: '#baccce',
950: '#000000',
},
}SCSS
$custom: #baccce; $custom-light: #cedbdc; $custom-dark: #000000;
JSON
{
"hex": "#baccce",
"rgb": {
"r": 186,
"g": 204,
"b": 206
},
"hsl": {
"h": 186,
"s": 16.949,
"l": 76.863
},
"oklch": {
"l": 0.83218,
"c": 0.01977,
"h": 204.8
},
"luminance": 0.58081
}Semantic roles & 50–950 ramp
primary
#BACCCE
secondary
#A38C8A
accent
#524A9B
background
#FEFEFE
surface
#FBFBFC
border
#D4D4D5
text
#131515
muted
#838484