What is the meaning of the Teal color?
Teal is a deep blue-green shade resembling the color of the common teal bird's wing. It combines the calming properties of blue with the renewing qualities of green, offering a sophisticated, modern choice for web app interfaces.
How to use the Teal color hex code in HTML & CSS?
To style elements with Teal on a website, use the hex code #008080 in your HTML/CSS. Adding background-color: #008080; will render the color. In Tailwind CSS, you can apply this shade dynamically using classes like bg-[#008080] or configuring it as a color variable in your configuration file.
What are the RGB and HSL codes of Teal?
In the digital sRGB spectrum, the Teal color code is mapped to RGB values of Red: 0, Green: 128, and Blue: 128. In the HSL system, it registers at hue angle 180°, saturation 100%, and lightness index 25%. It represents a dark, rich color characterized by a highly vivid, intense, and brilliant shade.
CMYK print profiles for Teal color
To reproduce the named shade Teal in print systems, the CMYK ink configuration requires 100% Cyan, 0% Magenta, 0% Yellow, and 50% black. These neutral color boundaries serve as solid structural backgrounds, layouts, and typography grids.
Teal Color Space Conversions
Click to copy formatContrast & Accessibility (WCAG 2.1) Check
White text readability test with #008080
Small body copy preview
Black text readability test with #008080
Small body copy preview
Complementary & Analogous Harmonies
Computed dynamicallyShades & Tints Generator Matrix
Copy shade hex values instantlyDarker Shades (Adding Black)
Lighter Tints (Adding White)
CSS Custom Properties (Variables)
--color-hex: #008080;
--color-rgb: rgb(0, 128, 128);
--color-hsl: hsl(180deg, 100%, 25%);
--color-name: teal;
Known Color Aliases
Teal Color Meaning
As a notable shade in the teal spectrum, Teal embodies the core psychological traits of the teal color family. The teal spectrum is the color of sophisticated balance, combining blue's emotional depth with green's natural energy. It has strong associations with healing, protection, and spiritual depth across many world cultures. In design, teal performs exceptionally well as an accent color — it's distinctive enough to attract attention without the aggression of more saturated hues. Healthcare institutions use teal because it combines green's association with health with blue's calming effect. Fashion and luxury brands use teal to signal understated sophistication. The color gained widespread recognition as the official color of ovarian cancer awareness, giving it additional cultural depth and meaning.
Emotions & Associations
Industries