Tempered Petrol color palette — #F0F7F3 · #B9B07E · #2975A7 · #6E6000 · #172632
Built around Slate, softened by Olive — the whole palette hums with nature and growth.
The five colors
- Ivory (#F0F7F3): a clean, paper-quiet neutral.
- Sage (#B9B07E): A luminous, dusty green — the color of a quiet forest floor.
- Slate (#2975A7): A full-bodied, balanced blue — the color of a favorite pair of jeans.
- Olive (#6E6000): A full-bodied, balanced green — the color of new leaves after rain.
- Midnight (#172632): A deep, shadowed, dusty blue — the color of a favorite pair of jeans.
Feels like: Nature, Growth, Trust, Stability, Sophistication. Tagged duotone, 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
- Ancient Garden color palette (#FBF2F6, #DAA079, #008077, #914900, #10282D)
- Hushed Olive Boulevard color palette (#EFF7F5, #96CDC2, #647DAC, #4B7C2D, #252E3C)
- Weathered Drift color palette (#F3F2E9, #A6BF70, #00887A, #576F00, #081106)
- Worn Olive color palette (#ECF8F4, #B8CF85, #00A3A9, #728C2B, #17272C)
- Chalky Lapis color palette (#E5FAF9, #62B781, #524BD3, #006738, #17173D)
- Garnet Grove color palette (#FBF1FF, #8EA06A, #00797D, #79324A, #144644)
- Petrol Station color palette (#ECF9EE, #A2834A, #006B99, #743200, #4A3300)
- Quiet Lagoon Boulevard color palette (#FCF6C1, #97B482, #2F8A66, #005B61, #004666)
Browse the whole catalog at Explore, or see today's palette.