What does the color Teal mean?

Cyan

Teal

#008080

#339999

#66b3b3

#99cccc

#cce6e6

#1a8080

Meaning

Freshness, clarity, and innovation. Great for tech accents and clean digital products.

History

Teal is a standard CSS/SVG named color used across browsers since early web standards.

Usage

Use Teal (#008080) in CSS as color: teal; or as #008080.

Preview

Teal

#008080

Overview

Family: Cyan

Accessibility on this swatch:

(4.77:1)

Contrast vs white: 4.77:1 · vs black: 4.4:1

Formats

HEX

#008080

RGB

rgb(0, 128, 128)

RGBA

rgba(0, 128, 128, 1)

HSL

hsl(180, 100%, 25%)

HSV

hsv(180, 100%, 50%)

LAB

lab(48.25% -28.85 -8.48)

LCH

lch(48.25% 30.07 196.38)

OKLAB

oklab(0.5431 -0.0896 -0.0236)

OKLCH

oklch(0.5431 0.0927 194.76)

XYZ

xyz(11.61, 17.00, 23.09)

CMYK

cmyk(100%, 0%, 0%, 50%)

CSS

color: #008080;

CSS variable

--color-008080: #008080;

SCSS

$color-008080: #008080;

Tailwind

cyan-700

Export

Developer code

:root {
  --teal-1: #008080;
}

Color psychology

Freshness, clarity, and innovation. Great for tech accents and clean digital products.

Usage examples: primary buttons, chart series, status badges, marketing gradients, and brand accents in the Cyan family.

Tints

Shades

Tones

Complementary

Analogous

Triadic

Split complementary

Monochromatic

Related shades & tints

#339999

#66b3b3

#99cccc

#cce6e6

#1a8080

#338080

#4d8080

#668080

Similar colors

#0b8383

#148583

#1e8a88

#008b8b

#1c7878

#2a8d8c

#267877

#368c89

Browse more in the color name library.