Skip to content

Sage #9caf88

The green that whispers.

RGB
156, 175, 136
HSL
89°, 20%, 61%
CMYK
11, 0, 22, 31
Luminance
0.3951

About Sage

Sage, #9caf88, is green muted with gray — the herb’s dusty leaf turned into the most requested interior color of the past decade. It is green with its saturation exhaled: calm made visible.

History

Named for the culinary herb, sage rode two waves: 1990s eco-design and the 2020s “quiet home” movement, where it became the default kitchen-cabinet and wedding-palette green. Its rise tracks the wellness economy almost exactly.

Psychology

Sage reads restorative, balanced and grown-up — nature without brightness, calm without coldness. It is the green hospitals and meditation apps reach for when mint feels too clinical.

In design

Sage is a large-surface color: walls, backgrounds, cards. It pairs with terracotta and clay (the decade’s defining duo), cream, walnut and brass. Text needs its darkest forms; #9caf88 itself is strictly surface. On dark themes, sage-tinted grays soften slate’s coldness.

In culture

Sage advice, burning sage, sage green nurseries: wisdom, cleansing and calm share one word. The herb’s Latin salvia means “to heal” — the color inherited the prescription.

Brands that own sage

Shades of sage

Every format

HEX#9caf88
RGBrgb(156, 175, 136)
HSLhsl(89, 20%, 61%)
CMYKcmyk(11%, 0%, 22%, 31%)
LABlab(69.1 -13.8 17.9)
LCHlch(69.1 22.5 127.6)
OKLCHoklch(0.729 0.059 128.9)

Copy-ready code

/* CSS */
color: #9caf88;
background-color: #9caf88;
/* Tailwind (arbitrary) */
class="text-[#9caf88] bg-[#9caf88]"
/* SCSS */
$brand: #9caf88;
/* SwiftUI */
Color(red: 0.612, green: 0.686, blue: 0.533)
/* Android */
Color.parseColor("#9caf88")

Accessibility — WCAG contrast

Aa
#9caf88 on white: 2.36:1
AA ✗ fail · AA-large · AAA
Aa
#9caf88 on black: 8.90:1
AA ✓ pass · AA-large · AAA
true color
protanopia
deuteranopia
tritanopia

RGB percentages

Red61.2%
Green68.6%
Blue53.3%

CMYK percentages

Cyan10.9%
Magenta0.0%
Yellow22.3%
Key (black)31.4%

Color previews

#9caf88 text on a black background

contrast 8.90:1

Card sample

#9caf88 text on a white background

contrast 2.36:1

Card sample

CSS3 live lab

Text font color

The quick brown fox

color: #9caf88;
Background color
Panel with #9caf88 background
background-color: #9caf88;
Text shadow — hex

Glowing headline

text-shadow: 2px 2px 8px #9caf88;
Text shadow — RGB

Soft neon halo

text-shadow: 0 0 14px rgba(156, 175, 136, 0.45);
Div box shadow
Elevated card
box-shadow: 0 12px 32px -8px rgba(156, 175, 136, 0.45);
Border & gradient
Gradient panel
border: 3px solid #9caf88;
background: linear-gradient(135deg, #9caf88, #88AF8E);

Monochromatic scale

Palettes built from #9caf88

Shades — darker

Tints — lighter

Hue & tone neighbors

Color harmonies

Nearest named colors

Sage, answered

What is the hex code for sage green?

Sage centers on #9caf88, spanning grayer eucalyptus #95afa2 to warmer artichoke #8f9779.

Why is sage green so popular?

It delivers nature’s calm at interior-safe saturation — restful on large surfaces where brighter greens fatigue. The wellness and quiet-luxury movements adopted it as their wall color.

What colors pair with sage?

Terracotta and clay are the signature partners; cream, walnut, brass and blush complete the modern-organic palette.

Work with #9caf88 in the Color Lab