#304D7C
#4F78A9
#89B3D6
#E9F1F7
#466455Juniper
#7CAD93Sage
#ACCEBAAsh
#E0EFE3Ice
Leafy Sage & Ash is a monochromatic color palette tagged gradient, muted. A monochromatic set: the same hue family from Juniper down to Ice. Saturation is moderate, which keeps it flexible for both interfaces and print.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Juniper | #466455 | rgb(70, 100, 85) | hsl(150, 18%, 33%) | oklch(47.5% 0.043 162) | |
| Sage | #7CAD93 | rgb(124, 173, 147) | hsl(148, 23%, 58%) | oklch(70.5% 0.065 161) | |
| Ash | #ACCEBA | rgb(172, 206, 186) | hsl(145, 26%, 74%) | oklch(82.1% 0.046 159) | |
| Ice | #E0EFE3 | rgb(224, 239, 227) | hsl(132, 32%, 91%) | oklch(93.8% 0.023 152) |
Why it works and how to use it
With 4 chromatic colors, Ash takes the lead while the rest support. Lightness runs from 33% to 91%. Well suited to websites, presentations and branding.
- Background: Ice (#E0EFE3) is the lightest color, so it belongs on large surfaces.
- Text: Juniper (#466455) on #E0EFE3 gives 5.48:1, passing WCAG AA.
- Primary: Ash (#ACCEBA) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Sage (#7CAD93) for highlights, badges and hover states.
1 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Juniper on Ice at 5.48:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Leafy Sage & Ash
A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.
Primary action SecondaryCard title
Card title
Card title
Roles are assigned by lightness.
Color blindness simulation
#466455
#7CAD93
#ACCEBA
#E0EFE3
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#466455 on #E0EFE3 | Aa | 5.48:1 | AA |
#466455 on #ACCEBA | Aa | 3.82:1 | AA large only |
#466455 on #7CAD93 | Aa | 2.57:1 | Fail |
#7CAD93 on #E0EFE3 | Aa | 2.13:1 | Fail |
#7CAD93 on #ACCEBA | Aa | 1.49:1 | Fail |
#ACCEBA on #E0EFE3 | Aa | 1.43:1 | Fail |
Similar palettes 24 more in this mood
#E7EAFF
#D8C7FF
#DCACDB
#C3A9B3
#4F6B6C
#75A6A8
#A4E8EA
#DBF4F5
#3A2920
#8E6A57
#B2805C
#FFEDDB
#2A4840
#4F8179
#7CAEA8
#C2DAD8
#855A8A
#A8688F
#D893A5
#FFBEBB
#2A1A12
#704E3C
#9C6B48
#E7D4C1
#506B57
#7AAA84
#B9F1BC
#E3F4E6
#826251
#C88E73
#FFC19D
#FFEAD9
#615132
#B89F66
#EDD693
#F9F3D9
#21393A
#446F71
#70ACAF
#D5ECEC
#BCF3F4
#55B1B5
#007579
#153B3D
#445C89
#759FC9
#ACDAFF
#E4F1F9
#004B4D
#008690
#4AB3C2
#B2DDE6
#30110D
#7B4139
#AE6755
#DAAD88
#2A1A12
#6D4B5E
#9C647C
#ECCFD5
#2A1A12
#545B38
#6C804B
#CEDDC8
#5B3DF5
#8E6BFF
#FF8FB1
#FFD1DC
#492121
#7F3F42
#B36667
#EFDEE0
#DDE8B8
#AED1A7
#7DAD9D
#568598
#4C3224
#8B5B43
#C28967
#F2DDCB
#3C096C
#7B2CBF
#C77DFF
#E0AAFF
#370617
#9D0208
#E85D04
#FAA307
#9FA9FF
#C8AEFF
#F0BFEF
#FFE3EE