Sage green is a soft, muted green with a grey cast, named after the herb. #9CAF88 is only 20% saturated, and that restraint is what separates it from a leaf green. Copy the HEX codes from any scheme below, or generate a fresh sage palette anchored to your own base colour.
Soft Sage is the greyest set, nothing above 21% saturation, and drifts warm at #B2AC88 and #DAD7CD. Sage & Cream adds real green with #588157 and #3A5A40, plus the cream tones that make it a complete scheme. Muted Sage is the only one with warm clay in it, #CB997E and #DDBEA9.
#9CAF88#B2AC88#DAD7CD#7C8471#5A6650#A3B18A#588157#3A5A40#DAD7CD#EAE7DC#B7B7A4#A5A58D#6B705C#CB997E#DDBEA9Anchored to a sage green base — press Space or Generate to roll more schemes. Click a swatch to copy its HEX, lock one to keep it while the rest re-roll, then export as CSS, JSON or HEX.
Drag in the colour area or the hue bar, or type a HEX / RGB value, then build a scheme anchored to it.
Sage is a near-neutral, so it behaves more like a warm grey than a green — which is why it pairs with almost anything muted: cream and beige for the ground, dusty rose or clay for the accent, a deep forest green for text. Weddings, skincare, interiors and calm brand systems use it more than any other green.
:root block with each colour as a custom property (--color-1, --color-2 and so on), or copy a single HEX straight from any swatch above. The Sage & Cream row above is a second ready-made option — #A3B18A, #EAE7DC and the three steps between them — if you would rather not generate at all. The generator itself rolls around #9CAF88, the base sage green for this page. Use Copy JSON for an array or Copy HEX for a comma-separated line if custom properties are not how your project stores colour.More palettes: Taupe palette · Mint Green palette · Beige palette · all colours