Teal Green

HEX: #00827F | Modern Palette

On White
4.67:1
PASS
On Black
4.50:1
FAIL

Color Specifications

HEX
#00827F
RGB
0, 130, 127
HSL
178°, 100% ,50%
CMYK
100, 0, 2.31, 49.02

About Teal Green

Teal Green (#00827F) is a color with RGB(0, 130, 127) and HSL(178.62°, 100%, 50.98%). It is commonly associated with Bold moods. In design, it fits Vivid, Cool styles and is suitable for Text, Button, Accent. Its complementary color is #820003, which creates strong contrast. Its triadic palette includes #7F0082 and #827F00. The name comes from Teal Green (English).

  • HEX: #00827F
  • RGB: 0, 130, 127
  • HSL: 178.62°, 100%, 50.98%
  • Mood: Bold
  • Style: Vivid, Cool
  • Use case: Text, Button, Accent
  • Complementary color: #820003
  • Triadic colors: #7F0082, #827F00
  • The name comes from Teal Green (English).

Live Components

LIGHT
DARK
System Notification Box

Color Palettes

Teal Green #00827F is used in Monochromatic, Neutral + Accent, Analogous, 3 + 1 + 1 palettes, giving designers ready-made combinations for backgrounds, surfaces, accents, and interface elements.

Monochromatic Five tones of the same hue — a reliable scale for backgrounds, surfaces, and text.
 
TEAL GREEN
 
 
 
Neutral + Accent Four near-neutral tones grounded by a saturated accent — clean and versatile for UI.
 
 
TEAL GREEN
 
 
Analogous Five hues drifting across a 60° arc — naturally harmonious and pleasing to the eye.
 
 
 
 
 
3 + 1 + 1 Three analogous base colors, one complementary accent, one dark anchor — bold yet balanced.
 
 
 
 
 

Color Harmonies

Teal Green #00827F pairs with #820003 as its complementary color, and #7F0082 and #827F00 in triadic combinations. These harmony relationships help create balanced color combinations for UI, branding, and design work.

Complementary

The color directly opposite on the color wheel — creates maximum contrast and vibrance.

TEAL GREEN
Analogous

Colors adjacent on the wheel — naturally harmonious and pleasing to the eye.

TEAL GREEN
Triadic

Three colors equally spaced 120° apart — bold, balanced, and visually rich.

TEAL GREEN
Split-Complementary

Two colors flanking the complement — high contrast with less tension than full complementary.

TEAL GREEN
Tetradic (Square)

Four colors at 90° intervals — rich variety, best when one color dominates.

TEAL GREEN
Monochromatic

Shades and tints of the same hue — cohesive, elegant, and easy to work with.

TEAL GREEN

Shades & Tints

The shade and tint range for Teal Green #00827F moves from dark #001A19 tones through the base color to lighter #E6FFFE tones, making it useful for depth, hierarchy, and background variation.

TEAL GREEN

Color Characteristics

Mood
Bold
Style
Vivid Cool
Use case
Text Button Accent

Accessibility Simulation

Deuteranopia #6F6F80
Protanopia #7B7B7F
Tritanopia #058282
Achromatopsia #747474

Frequently Asked Questions

Teal Green (#00827F) is a color with RGB(0, 130, 127) and HSL(178.62°, 100%, 50.98%).

#00827F pairs strongly with #820003 as its complementary color. It can also be used with neutral tones for balanced UI and design layouts.

#00827F is suitable for Text, Button, Accent and works well with Vivid, Cool styles.

#00827F is commonly associated with Bold.

The name Teal Green is linked to Teal Green from English, meaning A color resembling the color of the band around the eye of a common teal (a type of duck), combined with the general descriptor 'green'..

Name, History & Etymology

Origin Word Teal Green
Meaning A color resembling the color of the band around the eye of a common teal (a type of duck), combined with the general descriptor 'green'.
Language English
First Recorded Use Late 17th / Early 18th Century (for 'teal' as a color)

History

The color 'teal' derives its name from the common teal (Anas crecca), a duck species known for the distinctive greenish-blue stripe on its head. The word 'teal' itself comes from Middle Dutch 'taling' or 'teling'. As a color, 'teal' became popular in fashion and interior design, particularly in the mid-20th century. 'Teal Green' specifically emphasizes the greener variations of teal, distinguishing it from 'Teal Blue'. The hex code #00827f is a very balanced teal, leaning slightly more green than blue, hence 'Teal Green' is an appropriate descriptor.

First Recorded Use

The word 'teal' as a color name is recorded from the late 17th century, specifically referring to the duck's plumage. The compound 'Teal Green' likely emerged later as a more specific descriptor to emphasize the green undertones, distinguishing it from bluer teals. Exact first use of 'Teal Green' as a compound is harder to pinpoint but follows the establishment of 'teal' as a color.

Cultural Associations

Teal is often associated with sophistication, tranquility, and richness. It's a versatile color used in various contexts from fashion to home decor, and even corporate branding. Its connection to nature (the duck, water) gives it a calming and refreshing quality. 'Teal Green' specifically might evoke more natural, earthy, or forest-like associations compared to a bluer teal.

Similar Named Colors
Teal #008080 ΔE 1.44
Celadon Green #2F847C ΔE 3.00
Dark Cyan #008B8B ΔE 3.58
Myrtle Green #317873 ΔE 4.50

Code Snippets

/* Background */
.element {
    background-color: #00827F;
}

/* Text */
.element {
    color: #00827F;
}

/* Border */
.element {
    border: 1px solid #00827F;
}

/* Linear gradient to complementary */
.element {
    background: linear-gradient(
        to right,
        #00827F,
        #FF050B
    );
}

/* Radial gradient */
.element {
    background: radial-gradient(
        circle,
        #00827F,
        #FF050B
    );
}

// SCSS variable
$teal-green: #00827F;

// With RGB channels (useful for rgba() usage)
$teal-green-r: 0;
$teal-green-g: 130;
$teal-green-b: 127;

// Usage
.element {
    background-color: $teal-green;
    color: rgba($teal-green-r, $teal-green-g, $teal-green-b, 0.8);
}