#008080
Blue family

Teal

Also known as: calm · refreshing · sophisticated · deep · inviting
Save
Hex #008080
RGB rgb(0, 128, 128)
HSL hsl(180°, 100%, 25%)
CMYK 100 · 0 · 0 · 50
CSS teal
NCS S 3040-B20G

RAL and NCS values are nearest equivalents, not official designations.

Meaning

In Western cultures, teal often symbolizes emotional balance and rejuvenation, while in some Indigenous cultures of North America, it represents healing and protection. This duality makes teal a versatile color with varied meanings across different contexts.

The term 'teal' originated in the early 20th century, named after the common teal bird whose eyes are surrounded by this striking color. The first recorded use of teal as a color name in English dates back to 1917, showcasing its gradual acceptance into the color lexicon.

calmrefreshingsophisticateddeepinviting

The story of Teal

Where the name and the color come from.

Teal is named after a bird: the Eurasian teal, a small freshwater duck that wears a distinctive blue-green stripe across its eye. The color name entered English around 1917, borrowing the exact shade of that marking.

Sitting midway between blue and green, teal is one of those in-between colors that people argue about — and that ambiguity is its appeal. It feels both calming (its blue side) and refreshing (its green side).

Where you'll see Teal

The places, brands and moments that shaped this color.

Art Deco and the 1990s

Teal had two great moments — the sleek glamour of 1920s–30s Art Deco, and a saturated 1990s revival across fashion, cars and graphic design.

Healthcare and tech

Its calm, clean quality makes teal a favorite in medical, wellness and software branding.

Peacocks and tropical water

Nature's most famous teals — peacock feathers and shallow tropical seas — keep the color tied to richness and escape.

Using Teal in design

How it behaves in interiors, fashion and branding.

Teal is a confident accent that bridges blue and green schemes, which makes it unusually easy to slot into a palette. In interiors it brings depth on cabinetry, velvet and tile; in graphics it reads modern and trustworthy without the corporate coolness of pure blue.

Its natural complement is coral/orange, a pairing so reliable it has become a design cliché in the best sense — instantly balanced and lively.

What pairs with Teal

Curated combinations — and exactly why each one works.

Teal + Coral

Teal and coral are near-complementary: the warm-cool contrast is vivid, balanced and endlessly popular.

Teal + Mustard

Mustard's earthy gold glows against teal for a rich, retro palette.

Teal + Cream

Cream calms teal and lets it act as a jewel-toned accent rather than dominating.

Teal + Copper

Warm metallic copper against cool teal is a designer favorite — think bar interiors and luxe packaging.

Similar colors

Ranked by CIE76 ΔE — the perceptual distance from Teal. Lower ΔE means a closer match (below ~2 is barely distinguishable).

All 45 Blues →

Shades & tints

Nine steps of Teal by lightness — from #004343 (darkest) to #7ABDBD (lightest). Click any to copy.

-40% #004343
-30% #005252
-20% #006161
-10% #007171
BASE #008080
+15% #1F8F8F
+30% #3D9E9E
+50% #5CAEAE
+70% #7ABDBD

Complementary

Sitting opposite Teal at 0° on the color wheel, these give the highest-contrast pairings.

Palettes

Curated 5-color combinations featuring Teal.

#008080
#FFD700
#FFFFFF
#4682B4
#B0E0E6

Ocean Serenity

Peaceful Escape
#008080
#FF7F50
#F5F5F5
#2E8B57
#FFDAB9

Tropical Oasis

Vibrant Retreat
#008080
#4B0082
#E0E0E0
#B22222
#5F9EA0

Mystic Depths

Enigmatic Calm

Teal scale

A 50–900 tonal scale with Teal anchored at 500 — ready to drop into a design system. Click any step to copy.

50 #EBF5F5
100 #D1E8E8
200 #9ECFCF
300 #6BB5B5
400 #369B9B
500 #008080
600 #006969
700 #005454
800 #004040
900 #002C2C

Accessibility

Works well as text on light backgrounds; fails on dark.

Aa Best text color: #FFFFFF · 4.77:1
Teal as text on… Ratio AA AAA
Aa White background 4.77:1 Pass Large only
Aa Black background 4.4:1 Large only Fail

Thresholds: AA needs 4.5:1 (normal text) / 3:1 (large); AAA needs 7:1 / 4.5:1. Large = 18pt+ or 14pt+ bold.

How to use #008080

Copy-ready values for CSS, screen and print, plus the extra conversions designers reach for.

CSS color: teal;
CSS color-mix (lighten 30%) color-mix(in srgb, teal 70%, white)
HSV / HSB 180°, 100%, 50%
CMYK (print) 100, 0, 0, 50
Decimal 32896
Nearest web-safe #009999

Color vision

How Teal appears to viewers with the three main types of color blindness (~1 in 12 men, 1 in 200 women). Simulated approximations.

Normal vision

#008080

Protanopia (no red)

#373980

Deuteranopia (no green)

#302680

Tritanopia (no blue)

#068080

Teal FAQ

Quick answers to the questions people ask about Teal.

Is teal blue or green?

Both — teal is a blue-green that sits between the two on the color wheel. Depending on the exact mix and the light, it can lean either way, which is why people perceive it differently.

What is the difference between teal, turquoise and cyan?

Teal is the deepest and most muted; turquoise is brighter and a touch greener, evoking the gemstone; cyan is the lightest and most electric, a pure printing primary. Teal reads sophisticated, turquoise tropical, cyan digital.

What colors go with teal?

Coral and orange for vivid complementary contrast, mustard and gold for warmth, cream and white to lighten, and navy or charcoal for a deep, tonal scheme.

Bleu de France
25 / 45 Blues Cyan
Copied!