Recolorify
Sign inStart free →
DESIGN10 min read· Jun 22, 2026

The Ultimate Guide to Teal Color Codes, Hex Codes, and Shades of Teal

Teal is the color of calm confidence and modern tech — a blue-green that feels fresh, trustworthy, and distinctive, which is why so many SaaS and wellness brands lean on it. Whether you are a web designer matching co-brand assets, an e-commerce manager building variant listings, or a developer wiring up a design system, color codes are your shared language. In this guide we break down the hex codes, RGB coordinates, and LAB parameters for the most popular shades of teal, with practical tips on recoloring assets into these exact tones without quality loss.

The Ultimate Guide to Teal Color Codes, Hex Codes, and Shades of Teal

The core teals and their codes

Interactive Teal Swatch Grid

Click any swatch to copy its Hex code to your clipboard and view its RGB/HSL conversions.

Pure teal

HSL(180°, 100%, 25%) — the classic web teal.

Selected color: #008080

Teal in RGB, HSL, and CMYK

A hex code is a compact RGB triplet, so #008080 is RGB(0, 128, 128) — equal green and blue, no red. That balance is what makes teal read as a true blue-green.

For pure teal #008080: RGB(0, 128, 128), HSL(180°, 100%, 25%), CMYK(100%, 0%, 0%, 50%). For light sea green #20B2AA: RGB(32, 178, 170), HSL(177°, 70%, 41%).

Why hex alone isn't enough for recoloring

A hex code defines a target color, but it says nothing about lightness. When you recolor a navy product to teal with a flat RGB swap, you flatten the folds and shadows along with the hue — and the result looks fake.

This is why perceptually-uniform spaces matter. LAB separates lightness (the L channel — folds, highlights, shadows) from the color itself (A and B). Recoloring in LAB lets you hit an exact teal hex while every shadow and texture detail of the original survives.

Matching brand teals across assets

Teal sits right between blue and green, so it drifts toward either neighbor through compression and edits — defining it precisely keeps your brand from sliding into "just blue" or "just green." Define each brand teal once — with a name, a hex, and a use case — and recolor every asset to that exact value rather than eyeballing it.

With Recolorify you can paste an exact teal hex and recolor a logo, a product photo, or a garment to match it precisely, keeping texture intact. See also our guides to blue color codes and turquoise color codes.

Best color pairings for teal

  • Teal + coral (#FF6F61) — the classic complementary pairing; fresh and lively.
  • Teal + white (#FFFFFF) — clean and modern, a SaaS favorite.
  • Teal + charcoal (#333333) — understated and professional.
  • Teal + gold (#D4AF37) — rich and premium for jewel-toned palettes.
  • Teal + navy (#0B1F3A) — deep, calm, and trustworthy.

Frequently asked questions about teal color codes

What is the hex code for teal? The CSS keyword "teal" is #008080 — an equal mix of green and blue.

What is the RGB code for teal? Pure teal is RGB(0, 128, 128).

What is the difference between teal and turquoise? Teal (#008080) is darker and deeper; turquoise (#40E0D0) is brighter, lighter, and more tropical.

What is the hex code for dark teal? Dark teal is commonly #014D4E — a deep, authoritative blue-green.