Medium Turquoise

HEX: #48D1CC | Modern Palette

On White
1.86:1
FAIL
On Black
11.27:1
PASS

Color Specifications

HEX
#48D1CC
RGB
72, 209, 204
HSL
177°, 65% ,81%
CMYK
65.55, 0, 2.39, 18.04

About Medium Turquoise

Medium Turquoise (#48D1CC) is a color with RGB(72, 209, 204) and HSL(177.81°, 65.55%, 81.96%). It is commonly associated with Playful moods. In design, it fits Cool styles and is suitable for Text, Button, Background. Its complementary color is #D1484D, which creates strong contrast. Its triadic palette includes #CC48D1 and #D1CC48. The name comes from turquois (French).

  • HEX: #48D1CC
  • RGB: 72, 209, 204
  • HSL: 177.81°, 65.55%, 81.96%
  • Mood: Playful
  • Style: Cool
  • Use case: Text, Button, Background
  • Complementary color: #D1484D
  • Triadic colors: #CC48D1, #D1CC48
  • The name comes from turquois (French).

Live Components

LIGHT
DARK
System Notification Box

Color Palettes

Monochromatic Five tones of the same hue — a reliable scale for backgrounds, surfaces, and text.
Neutral + Accent Four near-neutral tones grounded by a saturated accent — clean and versatile for UI.
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

Complementary

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

Analogous

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

Triadic

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

Split-Complementary

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

Tetradic (Square)

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

Monochromatic

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

Shades & Tints

A seamless scale of #48D1CC from deepest shade to lightest tint.

Color Characteristics

Mood
Playful
Style
Cool
Use case
Text Button Background

Accessibility Simulation

Deuteranopia #B7B7CE
Protanopia #C8C8CC
Tritanopia #4AD0D0
Achromatopsia #BEBEBE

Frequently Asked Questions

Medium Turquoise (#48D1CC) is a color with RGB(72, 209, 204) and HSL(177.81°, 65.55%, 81.96%).

#48D1CC pairs strongly with #D1484D as its complementary color. It can also be used with neutral tones for balanced UI and design layouts.

#48D1CC is suitable for Text, Button, Background and works well with Cool styles.

#48D1CC is commonly associated with Playful.

The name Medium Turquoise is linked to turquois from French, meaning Meaning 'Turkish' or 'from Turkey', referring to the origin of the gemstone..

Name, History & Etymology

Origin Word turquois
Meaning Meaning 'Turkish' or 'from Turkey', referring to the origin of the gemstone.
Language French
First Recorded Use 16th Century

History

The gemstone turquoise has been prized for millennia, with evidence of its use dating back to ancient Egypt and Persia. Its distinctive blue-green hue became synonymous with the stone itself. The color name 'turquoise' entered common usage to describe this specific shade, distinct from other blues and greens.

First Recorded Use

The English word 'turquoise' first appeared in the 16th century, derived from Old French 'turqueise'. It specifically referred to the gemstone imported to Europe via Turkey.

Cultural Associations

Turquoise holds significant cultural importance in many societies, particularly among Native American tribes in the Southwestern United States, where it symbolizes protection and good fortune. It is also a prominent color in Persian and Central Asian art and architecture, often seen in intricate tilework and jewelry.

Similar Named Colors
Robin's Egg Blue #1FCECB ΔE 1.86
Robin Egg Blue #00CCCC ΔE 2.79
Turquoise #30D5C8 ΔE 3.15
Dark Turquoise #00CED1 ΔE 3.22

Code Snippets

/* Background */
.element {
    background-color: #48D1CC;
}

/* Text */
.element {
    color: #48D1CC;
}

/* Border */
.element {
    border: 1px solid #48D1CC;
}

/* Linear gradient to complementary */
.element {
    background: linear-gradient(
        to right,
        #48D1CC,
        #EFB3B5
    );
}

/* Radial gradient */
.element {
    background: radial-gradient(
        circle,
        #48D1CC,
        #EFB3B5
    );
}

// SCSS variable
$medium-turquoise: #48D1CC;

// With RGB channels (useful for rgba() usage)
$medium-turquoise-r: 72;
$medium-turquoise-g: 209;
$medium-turquoise-b: 204;

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