#8BEACA
#D0DC82
#E3BD60
#457042
#457534Fern
#47B68BJade
#BC9D5ACamel
#BFC469Pistachio
Clay Jade & Pistachio color palette
Clay Jade & Pistachio is a split color palette tagged green. A split scheme: Fern plays against Pistachio across roughly 116° of hue. Saturation is moderate, which keeps it flexible for both interfaces and print. Warm and cool hues are mixed, which adds depth.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Fern | #457534 | rgb(69, 117, 52) | hsl(104, 38%, 33%) | oklch(51.2% 0.109 138) | |
| Jade | #47B68B | rgb(71, 182, 139) | hsl(157, 44%, 50%) | oklch(70.1% 0.120 164) | |
| Camel | #BC9D5A | rgb(188, 157, 90) | hsl(41, 42%, 55%) | oklch(71.0% 0.094 85) | |
| Pistachio | #BFC469 | rgb(191, 196, 105) | hsl(63, 44%, 59%) | oklch(79.7% 0.115 112) |
Why it works and how to use it
With 4 chromatic colors, Jade takes the lead while the rest support. Lightness runs from 33% to 59%. Well suited to websites, presentations and branding.
- Background: Pistachio (#BFC469) is the lightest color, so it belongs on large surfaces.
- Text: Fern (#457534) on #BFC469 gives 2.94:1, so pair it with a darker neutral for body copy.
- Primary: Jade (#47B68B) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Camel (#BC9D5A) for highlights, badges and hover states.
No pair inside the palette reaches 4.5:1, so add black or white for body text.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Clay Jade & Pistachio
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
#457534
#47B68B
#BC9D5A
#BFC469
Color-blind check: under protanopia and deuteranopia, Jade and Camel become hard to tell apart, so do not rely on that pair alone to carry meaning.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#457534 on #BFC469 | Aa | 2.94:1 | Fail |
#457534 on #47B68B | Aa | 2.17:1 | Fail |
#457534 on #BC9D5A | Aa | 2.11:1 | Fail |
#BC9D5A on #BFC469 | Aa | 1.4:1 | Fail |
#47B68B on #BFC469 | Aa | 1.36:1 | Fail |
#47B68B on #BC9D5A | Aa | 1.03:1 | Fail |
Similar palettes 24 more in this mood
#554910
#A76704
#A5BC85
#FFC5B2
#D4B693
#B18974
#8E974C
#896F00
#005313
#186F08
#4F8F45
#8FCD85
#8AA944
#00967D
#007D82
#285A34
#5CBAA9
#5E99B8
#23737D
#356345
#727B00
#D2A682
#87D07C
#F9CF62
#7F6000
#B8885D
#B3B96E
#AEE699
#684200
#688928
#1FA15B
#D6C03B
#00480D
#005748
#007E8C
#5A96BD
#293515
#447F4A
#209E77
#ACAB82
#673D22
#6C5936
#949761
#B3D6AC
#9DD6C7
#A4BB44
#A18000
#4C7653
#FDC76A
#89E5C7
#91C987
#585932
#4EA26C
#AB8F00
#89B56D
#BBC649
#003E41
#005E1A
#008C72
#3787A7
#9AC97E
#7FA16A
#547B3C
#0B4B00
#363300
#006469
#007C60
#599E41
#006325
#3CA081
#9EB57F
#18DAD3
#81DFB3
#C3A783
#837808
#415036
#5F5E41
#BA9A6D
#64D2AF
#B0D7A3
#404F1C
#00564B
#78A484
#D8C46F
#9FD1B2
#65CAE2
#4D978F
#0267A2
#8DA689
#1EAE81
#009590
#575E24