Obsidian Pine Oasis
A warm palette of 6 colors drawing on black, green, beige, with a wide lightness range, so it covers backgrounds, text and accents. Its lightest and darkest colors reach a contrast of 11.90:1, enough for body text.
About this palette
A warm palette of 6 colors drawing on black, green, beige, with a wide lightness range, so it covers backgrounds, text and accents. Its lightest and darkest colors reach a contrast of 11.90:1, enough for body text. Open any color for its conversions, shades, harmonies and contrast.
Colors
- ≈ Memorial Black#051203
A very dark, muted green (Memorial Black) that brings growth and calm. White text sits comfortably on it.
- ≈ Darkest Forest#1C2F17
A dark, muted green (Darkest Forest) that brings balance and health. White text sits comfortably on it.
- ≈ Forest Empress#396D2A
A medium, moderately saturated green (Forest Empress) that brings growth and calm. White text sits comfortably on it.
- ≈ Verde#8DB57D
A light, moderately saturated green (Verde) that brings balance and health. Dark text reads well on it.
- ≈ Cashew Nut#E6C6AA
A light, muted beige (Cashew Nut) that brings understated calm. Dark text reads well on it.
- ≈ Cognac#DB8A22
A light, moderately saturated orange (Cognac) that brings playful warmth. Dark text reads well on it.
Tags
Psychology
Meaning
Applications
Similar palettes
Pine & Peach
Forest Ember
Citrus Grove
Lagoon Coral
Jade Dynasty
Sage Linen
Accessibility
- On white19.19:1Excellent 5/5
- On black13.02:1Excellent 5/5
- Color blind friendly97% similarExcellent 5/5
Contrast is the best any color in the palette reaches on a plain white or black background. Color blind friendly shows how much of the difference between the colors is kept under the common kinds of color blindness.
Colors and suggested roles
| Color | Role | HEX |
|---|---|---|
| Memorial Black | Background | #051203 |
| Darkest Forest | Surface | #1C2F17 |
| Forest Empress | Primary | #396D2A |
| Verde | Secondary | #8DB57D |
| Cashew Nut | Light | #E6C6AA |
| Cognac | Accent | #DB8A22 |
CSS variables
:root {
--background: #051203;
--surface: #1C2F17;
--primary: #396D2A;
--secondary: #8DB57D;
--light: #E6C6AA;
--accent: #DB8A22;
}
Tailwind v4 (@theme)
@theme {
--color-background: #051203;
--color-surface: #1C2F17;
--color-primary: #396D2A;
--color-secondary: #8DB57D;
--color-light: #E6C6AA;
--color-accent: #DB8A22;
}