#D4B693
#B18974
#8E974C
#896F00
#5F5E41Umber
#BA9A6DCamel
#64D2AFEucalyptus
#B0D7A3Celadon
Eucalyptus & Celadon Whisper is a split color palette tagged brown, green. A split scheme: Umber plays against Celadon across roughly 126° 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 |
|---|---|---|---|---|---|
| Umber | #5F5E41 | rgb(95, 94, 65) | hsl(58, 19%, 31%) | oklch(47.5% 0.044 106) | |
| Camel | #BA9A6D | rgb(186, 154, 109) | hsl(35, 36%, 58%) | oklch(70.5% 0.072 76) | |
| Eucalyptus | #64D2AF | rgb(100, 210, 175) | hsl(161, 55%, 61%) | oklch(78.9% 0.114 170) | |
| Celadon | #B0D7A3 | rgb(176, 215, 163) | hsl(105, 39%, 74%) | oklch(83.8% 0.082 138) |
Why it works and how to use it
The palette holds together thanks to its split hue relationship and a soft light-to-dark ladder (74% down to 31% lightness). A natural fit for websites, presentations and branding.
- Background: Celadon (#B0D7A3) is the lightest color, so it belongs on large surfaces.
- Text: Umber (#5F5E41) on #B0D7A3 gives 4.14:1, enough for large headings only.
- Primary: Eucalyptus (#64D2AF) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Camel (#BA9A6D) 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 Eucalyptus & Celadon Whisper
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
#5F5E41
#BA9A6D
#64D2AF
#B0D7A3
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#5F5E41 on #B0D7A3 | Aa | 4.14:1 | AA large only |
#5F5E41 on #64D2AF | Aa | 3.6:1 | AA large only |
#5F5E41 on #BA9A6D | Aa | 2.51:1 | Fail |
#BA9A6D on #B0D7A3 | Aa | 1.65:1 | Fail |
#BA9A6D on #64D2AF | Aa | 1.43:1 | Fail |
#64D2AF on #B0D7A3 | Aa | 1.15:1 | Fail |
Similar palettes 24 more in this mood
#7F6000
#B8885D
#B3B96E
#AEE699
#673D22
#6C5936
#949761
#B3D6AC
#8BEACA
#D0DC82
#E3BD60
#457042
#554910
#A76704
#A5BC85
#FFC5B2
#594229
#6F7218
#AB9C75
#CEAB9A
#C6CD7D
#EA8D6D
#A59775
#864D00
#005313
#186F08
#4F8F45
#8FCD85
#8AA944
#00967D
#007D82
#285A34
#457534
#47B68B
#BC9D5A
#BFC469
#5CBAA9
#5E99B8
#23737D
#356345
#727B00
#D2A682
#87D07C
#F9CF62
#63BDB2
#D88F7A
#3C7BAC
#966457
#684200
#688928
#1FA15B
#D6C03B
#00480D
#005748
#007E8C
#5A96BD
#293515
#447F4A
#209E77
#ACAB82
#9DD6C7
#A4BB44
#A18000
#4C7653
#FDC76A
#89E5C7
#91C987
#585932
#D798C1
#8E6C65
#98485B
#72523A
#8C4E2D
#925D67
#BD7269
#A88C6F
#DEB4A2
#BE9696
#7E5726
#4F4206
#4EA26C
#AB8F00
#89B56D
#BBC649
#BDC27E
#755E32
#5D4637
#31542B
#712F00
#9B4B24
#DD8865
#E6AA93