Slate Gray

HEX: #708090 | Modern Palette

On White
4.05:1
FAIL
On Black
5.18:1
PASS

Color Specifications

HEX
#708090
RGB
112, 128, 144
HSL
210°, 22% ,56%
CMYK
22.22, 11.11, 0, 43.53

About Slate Gray

Slate Gray (#708090) is a color with RGB(112, 128, 144) and HSL(210°, 22.22%, 56.47%). It is commonly associated with Calm moods. In design, it fits Muted, Cool styles and is suitable for Text, Background, Border. Its complementary color is #908070, which creates strong contrast. Its triadic palette includes #907080 and #809070. The name comes from Slate Gray (English).

  • HEX: #708090
  • RGB: 112, 128, 144
  • HSL: 210°, 22.22%, 56.47%
  • Mood: Calm
  • Style: Muted, Cool
  • Use case: Text, Background, Border
  • Complementary color: #908070
  • Triadic colors: #907080, #809070
  • The name comes from Slate Gray (English).

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 #708090 from deepest shade to lightest tint.

Color Characteristics

Mood
Calm
Style
Muted Cool

Accessibility Simulation

Deuteranopia #7C7C90
Protanopia #7E7E90
Tritanopia #6D8282
Achromatopsia #7E7E7E

Frequently Asked Questions

Slate Gray (#708090) is a color with RGB(112, 128, 144) and HSL(210°, 22.22%, 56.47%).

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

#708090 is suitable for Text, Background, Border and works well with Muted, Cool styles.

#708090 is commonly associated with Calm.

The name Slate Gray is linked to Slate Gray from English, meaning A color resembling that of natural slate rock, which is typically a dark, bluish-gray..

Name, History & Etymology

Origin Word Slate Gray
Meaning A color resembling that of natural slate rock, which is typically a dark, bluish-gray.
Language English
First Recorded Use Late 17th Century

History

Slate is a fine-grained, foliated, homogeneous metamorphic rock derived from an original shale-type sedimentary rock composed of clay or volcanic ash through low-grade regional metamorphism. It is the finest grained foliated metamorphic rock. The color 'slate gray' directly references the typical appearance of this rock. Historically, slate has been used for roofing, flooring, and writing slates. The color became a common descriptor in fashion, art, and manufacturing due to its widespread recognition and association with a durable, natural material. Its neutrality and versatility have contributed to its enduring popularity.

First Recorded Use

The term 'slate' for the rock itself dates back to Middle English, but 'slate gray' as a specific color descriptor likely solidified in common usage as slate became a more prevalent building material and its color a recognizable standard. Early references to 'slate colour' or 'slate gray' appear in texts describing natural colors or dyes.

Cultural Associations

Slate gray is often associated with sophistication, stability, and a certain understated elegance. It can evoke feelings of seriousness, tradition, and practicality. In fashion, it's considered a classic neutral. In interior design, it's used to create calm and modern spaces. Due to its natural origin, it also carries connotations of earthiness and organic aesthetics, despite its often cool undertones. It's a color frequently seen in professional attire and architectural elements.

Similar Named Colors

Light Slate Gray #778899 ΔE 2.97
Shadow Blue #778BA5 ΔE 5.53
Roman Silver #838996 ΔE 5.65
Air Force Blue (RAF) #5D8AA8 ΔE 7.65

Code Snippets

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

/* Text */
.element {
    color: #708090;
}

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

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

/* Radial gradient */
.element {
    background: radial-gradient(
        circle,
        #708090,
        #A99077
    );
}

// SCSS variable
$slate-gray: #708090;

// With RGB channels (useful for rgba() usage)
$slate-gray-r: 112;
$slate-gray-g: 128;
$slate-gray-b: 144;

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