#56724DFern
#96B878Sage
#E4F3C2Vanilla
#FBFAF3Snow

Lush Sage & Vanilla color palette

Open in generator
Ask AI about this palette: ChatGPTClaudePerplexity

Lush Sage & Vanilla is a analogous color palette tagged nature, muted, green. Analogous neighbors on the wheel (Fern, Sage, Vanilla) give it a natural, low-tension flow. Saturation is moderate, which keeps it flexible for both interfaces and print.

Color codes click any value to copy

SwatchNameHEXRGBHSLOKLCH
Fern#56724Drgb(86, 114, 77)hsl(105, 19%, 37%)oklch(52.0% 0.065 138)
Sage#96B878rgb(150, 184, 120)hsl(92, 31%, 60%)oklch(74.2% 0.095 131)
Vanilla#E4F3C2rgb(228, 243, 194)hsl(78, 67%, 86%)oklch(94.1% 0.066 122)
Snow#FBFAF3rgb(251, 250, 243)hsl(53, 50%, 97%)oklch(98.4% 0.009 100)

Why it works and how to use it

With 3 chromatic colors, Vanilla takes the lead while the rest support. Lightness runs from 37% to 97%. Well suited to wellness, organic and outdoor brands.

  • Background: Snow (#FBFAF3) is the lightest color, so it belongs on large surfaces.
  • Text: Fern (#56724D) on #FBFAF3 gives 5.13:1, passing WCAG AA.
  • Primary: Vanilla (#E4F3C2) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
  • Accent: Sage (#96B878) for highlights, badges and hover states.

2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Fern on Snow at 5.13:1.

Preview on a real UI see how the palette feels in context

BrandFeaturesPricingBlogGet started

Design faster with Lush Sage & Vanilla

A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.

Primary action Secondary
Card title
Card title
Card title
Roles are assigned by lightness.

Color blindness simulation

#56724D
#96B878
#E4F3C2
#FBFAF3

Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.

Contrast check WCAG ratios between palette colors

PairSampleRatioLevel
#56724D on #FBFAF3Aa5.13:1AA
#56724D on #E4F3C2Aa4.58:1AA
#56724D on #96B878Aa2.41:1Fail
#96B878 on #FBFAF3Aa2.13:1Fail
#96B878 on #E4F3C2Aa1.9:1Fail
#E4F3C2 on #FBFAF3Aa1.12:1Fail

Similar palettes 24 more in this mood