Teal color codes
| CSS name | teal |
|---|---|
| HEX | #008080 |
| RGB | rgb(0, 128, 128) |
| HSL | hsl(180, 100%, 25%) |
| CMYK | cmyk(100%, 0%, 0%, 50%) |
| Decimal | 32896 |
Shades of Teal (darker)
#007373 · #006666 · #005A5A · #004D4D · #004040 · #003333 · #002626 · #001A1A · #000D0D
Tints of Teal (lighter)
#1A8D8D · #339999 · #4DA6A6 · #66B3B3 · #80C0C0 · #99CCCC · #B3D9D9 · #CCE6E6 · #E6F2F2
Color harmonies
| Complementary | #800000 |
|---|---|
| Triadic | #800080, #808000 |
| Analogous | #008040, #004080 |
Accessibility (WCAG contrast)
| White text on Teal | 4.77:1 · AA |
|---|---|
| Black text on Teal | 4.40:1 · AA large text only |
Use Teal in code
.element {
color: teal; /* or #008080 */
background-color: rgb(0 128 128 / 0.5);
}Frequently asked questions
What is the hex code for Teal?
Teal is #008080 in HEX, rgb(0, 128, 128) in RGB and hsl(180, 100%, 25%) in HSL.
Can I use "teal" directly in CSS?
Yes. "teal" is one of the 148 standard CSS named colors, so color: teal; works in every browser.
Is Teal readable on white?
The contrast ratio of Teal on white is 4.77:1 (WCAG AA). On black it is 4.40:1 (AA large text only).
What is the complementary color of Teal?
The complementary color (opposite on the color wheel) is #800000.
Similar colors
Dark Cyan#008B8BSea Green#2E8B57Light Sea Green#20B2AAMedium Sea Green#3CB371Dark Slate Gray#2F4F4FDark Slate Grey#2F4F4FSteel Blue#4682B4Dark Slate Blue#483D8B
Convert any color with the Color Converter, generate palettes with the Random Color Generator, or browse all 148 CSS color names.