Pale Cyan

HEX: #87D3F8 | Modern Palette

On White
1.65:1
FAIL
On Black
12.70:1
PASS

Color Specifications

HEX
#87D3F8
RGB
135, 211, 248
HSL
199°, 45% ,97%
CMYK
45.56, 14.92, 0, 2.75

About Pale Cyan

Pale Cyan (#87D3F8) is a color with RGB(135, 211, 248) and HSL(199.65°, 45.56%, 97.25%). In design, it fits Cool styles and is suitable for Text, Button, Background. Its complementary color is #F8AC87, which creates strong contrast. Its triadic palette includes #F887D3 and #D3F887. The name comes from Pale Cyan (English).

  • HEX: #87D3F8
  • RGB: 135, 211, 248
  • HSL: 199.65°, 45.56%, 97.25%
  • Style: Cool
  • Use case: Text, Button, Background
  • Complementary color: #F8AC87
  • Triadic colors: #F887D3, #D3F887
  • The name comes from Pale Cyan (English).

Live Components

LIGHT
DARK
System Notification Box

Color Palettes

Pale Cyan #87D3F8 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.
 
 
 
PALE CYAN
 
Neutral + Accent Four near-neutral tones grounded by a saturated accent — clean and versatile for UI.
 
 
PALE CYAN
 
 
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

Pale Cyan #87D3F8 pairs with #F8AC87 as its complementary color, and #F887D3 and #D3F887 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.

PALE CYAN
Analogous

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

PALE CYAN
Triadic

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

PALE CYAN
Split-Complementary

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

PALE CYAN
Tetradic (Square)

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

PALE CYAN
Monochromatic

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

PALE CYAN

Shades & Tints

The shade and tint range for Pale Cyan #87D3F8 moves from dark #011118 tones through the base color to lighter #E7F6FE tones, making it useful for depth, hierarchy, and background variation.

PALE CYAN

Color Characteristics

Mood
Style
Cool
Use case
Text Button Background

Accessibility Simulation

Deuteranopia #C1C1F9
Protanopia #CCCCF8
Tritanopia #7DD8D8
Achromatopsia #C9C9C9

Frequently Asked Questions

Pale Cyan (#87D3F8) is a color with RGB(135, 211, 248) and HSL(199.65°, 45.56%, 97.25%).

#87D3F8 pairs strongly with #F8AC87 as its complementary color. It can also be used with neutral tones for balanced UI and design layouts.

#87D3F8 is suitable for Text, Button, Background and works well with Cool styles.

The name Pale Cyan is linked to Pale Cyan from English, meaning A light, desaturated shade of cyan..

Name, History & Etymology

Origin Word Pale Cyan
Meaning A light, desaturated shade of cyan.
Language English
First Recorded Use Late 20th Century

History

Cyan itself is one of the subtractive primary colors (CMYK) and has been recognized as a distinct hue for centuries, though its precise definition and naming have evolved. The term 'cyan' comes from the Greek 'kyanos' (κυανός), meaning 'dark blue enamel' or 'lapis lazuli'. The 'pale' modifier is a common English adjective used to describe a lighter, less saturated version of a color. The combination 'Pale Cyan' gained prominence as a specific color name with the standardization of color palettes in computing and graphic design, allowing for more nuanced descriptions beyond basic color terms.

First Recorded Use

The specific named color 'Pale Cyan' likely emerged with the advent of digital color systems and web design, where precise color naming and hexadecimal codes became common. While cyan as a color has ancient roots, the 'pale cyan' descriptor as a distinct, named color is modern.

Cultural Associations

Pale cyan, like many light blues and greens, often evokes feelings of calmness, serenity, and freshness. It can be associated with clear skies, shallow waters, or a gentle breeze. In design, it's frequently used for backgrounds, user interfaces, and branding where a soft, approachable, and modern aesthetic is desired. It can also be seen in medical or spa environments due to its calming properties.

Similar Named Colors
Baby Blue #89CFF0 ΔE 1.37
Sky Blue #87CEEB ΔE 2.53
Light Sky Blue #87CEFA ΔE 2.69
Columbia Blue #9BDDFF ΔE 2.93

Code Snippets

/* Background */
.element {
    background-color: #87D3F8;
}

/* Text */
.element {
    color: #87D3F8;
}

/* Border */
.element {
    border: 1px solid #87D3F8;
}

/* Linear gradient to complementary */
.element {
    background: linear-gradient(
        to right,
        #87D3F8,
        #FBF7F5
    );
}

/* Radial gradient */
.element {
    background: radial-gradient(
        circle,
        #87D3F8,
        #FBF7F5
    );
}

// SCSS variable
$pale-cyan: #87D3F8;

// With RGB channels (useful for rgba() usage)
$pale-cyan-r: 135;
$pale-cyan-g: 211;
$pale-cyan-b: 248;

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