Sage

HEX: #BCB88A | Modern Palette

On White
2.03:1
FAIL
On Black
10.36:1
PASS

Color Specifications

HEX
#BCB88A
RGB
188, 184, 138
HSL
55°, 26% ,73%
CMYK
0, 2.13, 26.6, 26.27

About Sage

Sage (#BCB88A) is a color with RGB(188, 184, 138) and HSL(55.2°, 26.6%, 73.73%). In design, it fits Pastel, Warm styles and is suitable for Text, Border, Print. Its complementary color is #8A8EBC, which creates strong contrast. Its triadic palette includes #8ABCB8 and #B88ABC. The name comes from sage (Old French).

  • HEX: #BCB88A
  • RGB: 188, 184, 138
  • HSL: 55.2°, 26.6%, 73.73%
  • Style: Pastel, Warm
  • Use case: Text, Border, Print
  • Complementary color: #8A8EBC
  • Triadic colors: #8ABCB8, #B88ABC
  • The name comes from sage (Old French).

Live Components

LIGHT
DARK
System Notification Box

Color Palettes

Sage #BCB88A 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.
 
 
 
SAGE
 
Neutral + Accent Four near-neutral tones grounded by a saturated accent — clean and versatile for UI.
 
 
SAGE
 
 
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

Sage #BCB88A pairs with #8A8EBC as its complementary color, and #8ABCB8 and #B88ABC 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.

SAGE
Analogous

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

SAGE
Triadic

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

SAGE
Split-Complementary

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

SAGE
Tetradic (Square)

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

SAGE
Monochromatic

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

SAGE

Shades & Tints

The shade and tint range for Sage #BCB88A moves from dark #101009 tones through the base color to lighter #F6F5EF tones, making it useful for depth, hierarchy, and background variation.

SAGE

Color Characteristics

Mood
Style
Pastel Warm
Use case
Text Border Print

Accessibility Simulation

Deuteranopia #B9B98A
Protanopia #B8B88A
Tritanopia #C1B3B3
Achromatopsia #B6B6B6

Frequently Asked Questions

Sage (#BCB88A) is a color with RGB(188, 184, 138) and HSL(55.2°, 26.6%, 73.73%).

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

#BCB88A is suitable for Text, Border, Print and works well with Pastel, Warm styles.

The name Sage is linked to sage from Old French, meaning wise, learned, judicious.

Name, History & Etymology

Origin Word sage
Meaning wise, learned, judicious
Language Old French
First Recorded Use Middle English

History

The word "sage" entered English from Old French, which itself derived from Vulgar Latin *sapius, a derivative of Latin sapere 'to be wise, to taste'. The connection between wisdom and taste is interesting, suggesting that discernment applies to both intellectual understanding and sensory experience. Initially, it referred primarily to a wise person. Over time, it also came to refer to the plant (Salvia officinalis) known for its medicinal properties and culinary use, likely due to its perceived 'healing' or 'wise' qualities, or perhaps its strong, distinctive 'taste'. The color 'sage' (bcb88a) is a relatively modern descriptor, emerging from the visual association with the muted, grayish-green leaves of the sage plant.

First Recorded Use

c. 1300

Cultural Associations

The concept of a 'sage' as a wise elder or spiritual guide is prevalent across many cultures and philosophical traditions (e.g., the Seven Sages of Greece, Confucian sages, Hindu rishis). The sage plant itself holds cultural significance, often associated with purification, healing, and longevity. In some traditions, burning sage is believed to cleanse spaces of negative energy. The color 'sage green' evokes feelings of nature, tranquility, and understated elegance, making it popular in interior design and fashion.

Similar Named Colors
Sand #C2B280 ΔE 4.43
Olive Green #BAB86C ΔE 6.34
Dark Khaki #BDB76B ΔE 6.38
Khaki #C3B091 ΔE 8.36

Code Snippets

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

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

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

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

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

// SCSS variable
$sage: #BCB88A;

// With RGB channels (useful for rgba() usage)
$sage-r: 188;
$sage-g: 184;
$sage-b: 138;

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