Tempered Petrol color palette — #EEF8F3 · #B5B678 · #5A9D79 · #007784 · #2E4363
Teal takes the lead with Fern close behind in a set that reads as nature and growth at first glance.
The five colors
- Ivory (#EEF8F3): bright and airy, almost weightless.
- Sage (#B5B678): A luminous, balanced green — the color of a quiet forest floor.
- Fern (#5A9D79): A luminous, balanced teal — the color of shallow lagoons.
- Teal (#007784): A full-bodied, balanced blue — the color of deep harbor water.
- Navy (#2E4363): A deep, shadowed, dusty blue — the color of a favorite pair of jeans.
Feels like: Nature, Growth, Trust, Stability, Sophistication. Tagged muted.
Use it as a design system
One click turns Tempered Petrol into a complete token system: semantic roles from primary to success, an 11-stop OKLCH scale per role, a WCAG AA/AAA and APCA contrast matrix, an auto-derived dark mode and 11 export formats including CSS custom properties, Tailwind, Figma Variables and shadcn/ui.
Similar palettes
- Weathered Grove color palette (#FEF3E8, #F8BF81, #94A166, #3A7864, #3E3634)
- Denim Coast color palette (#E3F6F6, #53A97F, #00818C, #005191, #311F52)
- Washed Denim Cabin color palette (#E9FAF0, #BFDCCF, #96B2AB, #6D8B93, #3D5764)
- Dusty Petrol color palette (#ECF8F9, #87BFA9, #4E98AD, #5464A3, #533657)
- Worn Courtyard color palette (#E5FCEF, #AF9D00, #008F4F, #00616B, #492700)
- Tempered Archive color palette (#FBF2F8, #C68579, #0D8467, #5A487B, #3C3F5F)
- Dusty Olive Orchard color palette (#E3FDE8, #D7C896, #AB9E56, #7C7D2B, #31594A)
- Pine Alley color palette (#FDF1F9, #DDA18D, #A28A45, #497642, #5E3244)
Browse the whole catalog at Explore, or see today's palette.