#0F5C63
#2A8A8C
#9FD3CF
#F2F1EA
#E0E0D6Bone
#BAC89DPutty
#92AD74Sage
#26371AEvergreen
Sage & Putty Haze color palette
Sage & Putty Haze is a monochromatic color palette tagged muted. All four colors sit within 15° of hue, so the scheme reads as one color explored across light and dark. Neither washed out nor loud, it adapts to most contexts.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Bone | #E0E0D6 | rgb(224, 224, 214) | hsl(60, 14%, 86%) | oklch(90.4% 0.013 107) | |
| Putty | #BAC89D | rgb(186, 200, 157) | hsl(80, 28%, 70%) | oklch(81.1% 0.060 122) | |
| Sage | #92AD74 | rgb(146, 173, 116) | hsl(88, 26%, 57%) | oklch(71.3% 0.084 129) | |
| Evergreen | #26371A | rgb(38, 55, 26) | hsl(95, 36%, 16%) | oklch(31.3% 0.053 134) |
Why it works and how to use it
With 3 chromatic colors, Putty takes the lead while the rest support. Lightness runs from 16% to 86%. Well suited to websites, presentations and branding.
- Background: Bone (#E0E0D6) is the lightest color, so it belongs on large surfaces.
- Text: Evergreen (#26371A) on #E0E0D6 gives 9.61:1, passing WCAG AAA.
- Primary: Putty (#BAC89D) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Sage (#92AD74) for highlights, badges and hover states.
3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Bone on Evergreen at 9.61:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Sage & Putty Haze
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
#E0E0D6
#BAC89D
#92AD74
#26371A
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#E0E0D6 on #26371A | Aa | 9.61:1 | AAA |
#BAC89D on #26371A | Aa | 7.2:1 | AAA |
#92AD74 on #26371A | Aa | 5.14:1 | AA |
#E0E0D6 on #92AD74 | Aa | 1.87:1 | Fail |
#BAC89D on #92AD74 | Aa | 1.4:1 | Fail |
#E0E0D6 on #BAC89D | Aa | 1.34:1 | Fail |
Similar palettes 24 more in this mood
#A47864
#C9A58B
#E8D9CB
#F7F3EE
#D9A48F
#EFC8B8
#F7E6DC
#FFFAF6
#0E3B4A
#1F7A8C
#8FD5D2
#EAF7F5
#3C5148
#7A9B76
#C8D5B9
#F6F5EE
#1A4D2E
#4F6F52
#E8DFCA
#F5EFE6
#116A7B
#CDC2AE
#ECE5C7
#C2DEDC
#B08968
#DDB892
#E6CCB2
#FFF6EA
#27374D
#526D82
#9DB2BF
#DDE6ED
#3E2723
#6D4C41
#A1887F
#EFEBE9
#40513B
#609966
#9DC08B
#EDF1D6
#0D1B2A
#3C5374
#5A7A9E
#E0E1DD
#CDB4DB
#FFC8DD
#FFAFCC
#BDE0FE
#7F5539
#B08968
#DDB892
#EDE0D4
#5E548E
#9F86C0
#BE95C4
#E0B1CB
#5F7161
#6D8B74
#A7C4BC
#EFEAD8
#006D77
#83C5BE
#EDF6F9
#FFDDD2
#3D405B
#81B29A
#F2CC8F
#F4F1DE
#7D6E5D
#B9A990
#E7DFD3
#F9F7F3
#5D4037
#8D6E63
#BCAAA4
#EFEBE9
#2F3E46
#354F52
#52796F
#CAD2C5
#FFAFCC
#FFC8DD
#BDE0FE
#A2D2FF
#0D1F22
#345365
#7A9E7E
#E9F5DB
#22223B
#595D79
#9A8C98
#F2E9E4