#008080

Teal

Teal is a blue-green color named after the Eurasian teal bird. It balances the calming properties of blue with the renewal qualities of green.

Teal Color Values

HEX#008080
RGB0, 128, 128
HSL180°, 100%, 25%
HSV180°, 100%, 50%
CMYK100%, 0%, 0%, 50%

Color Blindness Simulation

Protanopia
Red-blind. Cannot perceive red light.
Sees: #777980 (~1.3% of males)
Deuteranopia
Green-blind. Cannot perceive green light.
Sees: #686E81 (~1.2% of males)
Tritanopia
Blue-blind. Cannot perceive blue light.
Sees: #008480 (~0.01% of population)
Achromatopsia
Total color blindness. Sees only grayscale.
Sees: #6D6D6D (~0.003% of population)

Teal as Text Color

Teal on White
4.8:1AA
Teal on Light Gray
4.4:1FAIL
Teal on Cream
4.5:1AA
Teal on Dark
3.6:1FAIL
Teal on Black
4.4:1FAIL
Teal on Soft Blue
4.2:1FAIL
Teal on Soft Green
4.2:1FAIL
Teal on Soft Pink
4.0:1FAIL

Nearest Tailwind Class

teal-700
#0F766E

Nearest Pantone Match

Pantone 7702 C
#006BA6

CSS Variable Export

:root {
  --color-teal: #008080;
  --color-teal-rgb: 0, 128, 128;
}

Tailwind Config

// tailwind.config.js
colors: {
  'teal': '#008080',
}

Shades of Teal

#007F80
#007070
#006161
#005757
#004747
#003838
#002929
#001F1F
#000F0F
#000000

Tints of Teal

#007F80
#00A8A8
#00D6D6
#00FFFF
#29FFFF
#57FFFF
#80FFFF
#A8FFFF
#D6FFFF
#FFFFFF

Color Harmonies

Complementary

#008080
#800000

Analogous

#008040
#007F80
#004080

Triadic

#007F80
#80007F
#7F8000

Teal Text Preview

Heading in Teal

Body text in Teal. The quick brown fox jumps over the lazy dog.

White on Teal

Body text on a Teal background.

Teal text on dark background

Contrast: 3.7:1