Color code and palette
Teal Color
Teal sits between blue and green at #008080. It balances calm with freshness and is often easier to use across larger surfaces than brighter cyan.
Teal
#008080
Color formats
The same base color in common web formats.
Shades
| Color | Name | HEX | RGB | HSL | Copy |
|---|---|---|---|---|---|
| Teal 50 | #E5FFFF | 229, 255, 255 | 180, 100%, 95% | ||
| Teal 100 | #B3FFFF | 179, 255, 255 | 180, 100%, 85% | ||
| Teal 200 | #80FFFF | 128, 255, 255 | 180, 100%, 75% | ||
| Teal 300 | #4DFFFF | 77, 255, 255 | 180, 100%, 65% | ||
| Teal 400 | #1AFFFF | 26, 255, 255 | 180, 100%, 55% | ||
| Teal 500 | #00E5E6 | 0, 229, 230 | 180, 100%, 45% | ||
| Teal 600 | #00B2B3 | 0, 178, 179 | 180, 100%, 35% | ||
| Teal 700 | #007F80 | 0, 127, 128 | 180, 100%, 25% | ||
| Teal 800 | #004C4D | 0, 76, 77 | 181, 100%, 15% | ||
| Teal 900 | #00191A | 0, 25, 26 | 182, 100%, 5% |
Text contrast
These ratios use the WCAG relative luminance formula.
Aa White text 4.77:1
AA
Aa Black text 4.40:1
AA · Large text
Ways to use Teal
Healthcare and wellness interfaces
Calm calls to action
Charts paired with orange or coral
Colors that go with Teal
Color-wheel harmonies built from #008080. Click a swatch to copy it or open the set in the color wheel.
Split complementary
Open in color wheelA base plus the two neighbors of its complement — contrast with less tension.