#63CDC6#63CDC6
#63CDC6 is a light, moderate teal. Relative luminance 0.504; OKLCH L 78.4% C 0.099 H 189.6°. Best body text is #000000 at 11.08:1 contrast (WCAG AA passes).
Color values
| HEX | #63CDC6 |
|---|---|
| RGB | rgb(99, 205, 198) |
| HSL | hsl(176, 51%, 60%) |
| HSV | hsv(176, 52%, 80%) |
| CMYK | cmyk(51.7%, 0%, 3.4%, 19.6%) |
| CIE-LAB | lab(76.31, -32.25, -5.89) |
| CIE-LCH | lch(76.31, 32.78, 190.35°) |
| OKLab | oklab(78.38% -0.0974 -0.0164) |
| OKLCH | oklch(78.38% 0.099 189.6) |
| XYZ | xyz(37.1657, 50.3891, 61.1826) |
| Luminance | 0.5039 (WCAG relative) |
| Temperature | cool |
| Family | teal |
Closest named colors
Mediumturquoise
#48D1CC
ΔE00 2.36
Darkturquoise
#00CED1
ΔE00 5.01
Turquoise
#40E0D0
ΔE00 5.89
Topaz
#13BBAF
ΔE00 6.79
Seafoam Blue
#78D1B6
ΔE00 7.42
Turquoise (survey)
#06C2AC
ΔE00 7.55
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#63CDC6 #CD636A
analogous
#63CD91 #63CDC6 #639FCD
triadic
#63CDC6 #C663CD #CDC663
tetradic
#63CDC6 #9163CD #CD636A #9FCD63
square
#63CDC6 #9163CD #CD636A #9FCD63
split-complementary
#63CDC6 #CD639F #CD9163
monochromatic
#2C8A83 #3BB8B0 #63CDC6 #91DCD7 #C0EBE8
Accessibility & contrast
On white
1.90
#63CDC6 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
11.08
#63CDC6 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #63CDC6
11.08:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##63CDC6 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##63CDC6 | 1.00 | 1.90 | 11.08 | 11.08 |
| #FFFFFF | 1.90 | 1.00 | 21.00 | 21.00 |
| #000000 | 11.08 | 21.00 | 1.00 | 1.00 |
| ##000000 | 11.08 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#C3C4C6
Deuteranopia (green-blind)
#B2B7C7
Tritanopia (blue-blind)
#17D2CB
Achromatopsia (no color)
#BCBCBC
Design tokens & code
CSS
--color: #63cdc6; /* rgb */ color: rgb(99, 205, 198); /* oklch */ color: oklch(78.4% 0.099 189.6);
Tailwind
colors: {
custom: {
50: '#98dcd7',
500: '#63cdc6',
950: '#000000',
},
}SCSS
$custom: #63cdc6; $custom-light: #98dcd7; $custom-dark: #000000;
JSON
{
"hex": "#63cdc6",
"rgb": {
"r": 99,
"g": 205,
"b": 198
},
"hsl": {
"h": 176.038,
"s": 51.456,
"l": 59.608
},
"oklch": {
"l": 0.78377,
"c": 0.09876,
"h": 189.6
},
"luminance": 0.50393
}Semantic roles & 50–950 ramp
primary
#63CDC6
secondary
#904449
accent
#4D56DB
background
#FCFEFE
surface
#F5FCFB
border
#CFD5D4
text
#0E1514
muted
#7F8483