#B2AC88
Sage
Sage is a muted, grayish-green named after the sage herb. It is calming, sophisticated, and increasingly popular in interior and web design.
Sage Color Values
HEX#B2AC88
RGB178, 172, 136
HSL51°, 21%, 62%
HSV51°, 24%, 70%
CMYK0%, 3%, 24%, 30%
Color Blindness Simulation
Protanopia
Red-blind. Cannot perceive red light.
Sees: #B3AA86 (~1.3% of males)
Deuteranopia
Green-blind. Cannot perceive green light.
Sees: #B5AD89 (~1.2% of males)
Tritanopia
Blue-blind. Cannot perceive blue light.
Sees: #B9A7A2 (~0.01% of population)
Achromatopsia
Total color blindness. Sees only grayscale.
Sees: #AAAAAA (~0.003% of population)
Sage as Text Color
Sage on White
2.3:1FAIL
Sage on Light Gray
2.1:1FAIL
Sage on Cream
2.2:1FAIL
Sage on Dark
7.4:1AAA
Sage on Black
9.1:1AAA
Sage on Soft Blue
2.0:1FAIL
Sage on Soft Green
2.0:1FAIL
Sage on Soft Pink
1.9:1FAIL
Nearest Tailwind Class
gray-400
#9CA3AF
Nearest Pantone Match
Mocha Mousse (2025)
#A47764
CSS Variable Export
:root {
--color-sage: #B2AC88;
--color-sage-rgb: 178, 172, 136;
}Tailwind Config
// tailwind.config.js
colors: {
'sage': '#B2AC88',
}Shades of Sage
#B2AC8A
#A49D74
#948C61
#7F7853
#696344
#565238
#413D2A
#2B291C
#16140E
#000000
Tints of Sage
#B2AC8A
#BBB596
#C3BEA2
#CDC9B2
#D5D1BE
#DDDACB
#E5E3D7
#EFEEE6
#F7F6F3
#FFFFFF
Color Harmonies
Complementary
#B2AC88
#8A90B2
Analogous
#B2988A
#B2AC8A
#A4B28A
Triadic
#B2AC8A
#8AB2AC
#AC8AB2
Sage Text Preview
Heading in Sage
Body text in Sage. The quick brown fox jumps over the lazy dog.
White on Sage
Body text on a Sage background.
Sage text on dark background
Contrast: 7.7:1