#BCCFD1#BCCFD1
#BCCFD1 is a very light, muted teal. Relative luminance 0.599; OKLCH L 84.1% C 0.021 H 204.4°. Best body text is #000000 at 12.98:1 contrast (WCAG AA passes).
Color values
| HEX | #BCCFD1 |
|---|---|
| RGB | rgb(188, 207, 209) |
| HSL | hsl(186, 19%, 78%) |
| HSV | hsv(186, 10%, 82%) |
| CMYK | cmyk(10%, 1%, 0%, 18%) |
| CIE-LAB | lab(81.79, -5.99, -3.18) |
| CIE-LCH | lch(81.79, 6.78, 207.94°) |
| OKLab | oklab(84.08% -0.0189 -0.0086) |
| OKLCH | oklch(84.08% 0.021 204.4) |
| XYZ | xyz(54.5578, 59.9196, 69.0005) |
| Luminance | 0.5992 (WCAG relative) |
| Temperature | cool |
| Family | teal |
Closest named colors
Silver (survey)
#C5C9C7
ΔE00 5.97
Lightblue
#ADD8E6
ΔE00 7.05
Light Grey
#D8DCD6
ΔE00 7.49
Fog
#D8DCE0
ΔE00 7.60
Powder Blue
#B0E0E6
ΔE00 8.04
Light Gray
#D3D3D3
ΔE00 8.06
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#BCCFD1 #D1BEBC
analogous
#BCD1C8 #BCCFD1 #BCC4D1
triadic
#BCCFD1 #D1BCCF #CFD1BC
tetradic
#BCCFD1 #C8BCD1 #D1BEBC #C4D1BC
square
#BCCFD1 #C8BCD1 #D1BEBC #C4D1BC
split-complementary
#BCCFD1 #D1BCC4 #D1C8BC
monochromatic
#739B9F #98B5B8 #BCCFD1 #E0E9EA #EDF2F3
Accessibility & contrast
On white
1.62
#BCCFD1 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
12.98
#BCCFD1 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #BCCFD1
12.98:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##BCCFD1 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##BCCFD1 | 1.00 | 1.62 | 12.98 | 12.98 |
| #FFFFFF | 1.62 | 1.00 | 21.00 | 21.00 |
| #000000 | 12.98 | 21.00 | 1.00 | 1.00 |
| ##000000 | 12.98 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#CCCDD1
Deuteranopia (green-blind)
#C8CAD1
Tritanopia (blue-blind)
#B6D1D0
Achromatopsia (no color)
#CBCBCB
Design tokens & code
CSS
--color: #bccfd1; /* rgb */ color: rgb(188, 207, 209); /* oklch */ color: oklch(84.1% 0.021 204.4);
Tailwind
colors: {
custom: {
50: '#d0dddf',
500: '#bccfd1',
950: '#000000',
},
}SCSS
$custom: #bccfd1; $custom-light: #d0dddf; $custom-dark: #000000;
JSON
{
"hex": "#bccfd1",
"rgb": {
"r": 188,
"g": 207,
"b": 209
},
"hsl": {
"h": 185.714,
"s": 18.584,
"l": 77.843
},
"oklch": {
"l": 0.84078,
"c": 0.02077,
"h": 204.4
},
"luminance": 0.5992
}Semantic roles & 50–950 ramp
primary
#BCCFD1
secondary
#A68E8B
accent
#51499D
background
#FEFEFE
surface
#FBFCFC
border
#D4D5D5
text
#141515
muted
#838484