#28D09E#28D09E
#28D09E is a light, vivid teal. Relative luminance 0.480; OKLCH L 76.5% C 0.149 H 166.8°. Best body text is #000000 at 10.61:1 contrast (WCAG AA passes).
Color values
| HEX | #28D09E |
|---|---|
| RGB | rgb(40, 208, 158) |
| HSL | hsl(162, 68%, 49%) |
| HSV | hsv(162, 81%, 82%) |
| CMYK | cmyk(80.8%, 0%, 24%, 18.4%) |
| CIE-LAB | lab(74.84, -52.65, 13.32) |
| CIE-LCH | lch(74.84, 54.31, 165.80°) |
| OKLab | oklab(76.47% -0.1453 0.034) |
| OKLCH | oklch(76.47% 0.149 166.8) |
| XYZ | xyz(29.5990, 48.0278, 40.0514) |
| Luminance | 0.4803 (WCAG relative) |
| Temperature | neutral |
| Family | teal |
Closest named colors
Eucalyptus
#44D7A8
ΔE00 2.26
Greenblue
#23C48B
ΔE00 3.76
Aquamarine (survey)
#04D8B2
ΔE00 4.09
Green Blue
#01C08D
ΔE00 4.30
Mediumaquamarine
#66CDAA
ΔE00 4.98
Greenish Teal
#32BF84
ΔE00 5.33
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#28D09E #D0285A
analogous
#28D04A #28D09E #28AED0
triadic
#28D09E #9E28D0 #D09E28
tetradic
#28D09E #4A28D0 #D0285A #AED028
square
#28D09E #4A28D0 #D0285A #AED028
split-complementary
#28D09E #D028AE #D04A28
monochromatic
#146950 #1E9D77 #28D09E #57DFB6 #8AE8CC
Accessibility & contrast
On white
1.98
#28D09E on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
10.61
#28D09E on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #28D09E
10.61:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##28D09E | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##28D09E | 1.00 | 1.98 | 10.61 | 10.61 |
| #FFFFFF | 1.98 | 1.00 | 21.00 | 21.00 |
| #000000 | 10.61 | 21.00 | 1.00 | 1.00 |
| ##000000 | 10.61 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#CBC19B
Deuteranopia (green-blind)
#B7B2A1
Tritanopia (blue-blind)
#00D1C2
Achromatopsia (no color)
#B8B8B8
Design tokens & code
CSS
--color: #28d09e; /* rgb */ color: rgb(40, 208, 158); /* oklch */ color: oklch(76.5% 0.149 166.8);
Tailwind
colors: {
custom: {
50: '#7fdfba',
500: '#28d09e',
950: '#000000',
},
}SCSS
$custom: #28d09e; $custom-light: #7fdfba; $custom-dark: #000000;
JSON
{
"hex": "#28d09e",
"rgb": {
"r": 40,
"g": 208,
"b": 158
},
"hsl": {
"h": 162.143,
"s": 67.742,
"l": 48.627
},
"oklch": {
"l": 0.76465,
"c": 0.1492,
"h": 166.8
},
"luminance": 0.48031
}Semantic roles & 50–950 ramp
primary
#28D09E
secondary
#D2829A
accent
#3D71EB
background
#F8FDFB
surface
#F0FBF6
border
#CBD4D0
text
#0C1511
muted
#7D8380