Tempered Petrol color palette — #E7F1EF · #83BCC9 · #007390 · #004F53 · #003346
Teal and Forest set the tone — five colors that lean into trust and stability.
The five colors
- Cream (#E7F1EF): a clean, paper-quiet neutral.
- Ash (#83BCC9): A luminous, dusty blue — the color of open sky before noon.
- Teal (#007390): A full-bodied, balanced blue — the color of open sky before noon.
- Forest (#004F53): A deep, shadowed, dusty blue — the color of a favorite pair of jeans.
- Deep Teal (#003346): A deep, shadowed, dusty blue — the color of open sky before noon.
Feels like: Trust, Stability, Calm, Sophistication. Tagged coastal, cool, light, 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
- Dusty Petrol color palette (#F1E5ED, #77C0D0, #0074A2, #004D40, #001435)
- Timeworn Cerulean Orchard color palette (#EFF7F6, #ADCADB, #3181A8, #005E6B, #183E58)
- Timeworn Drift color palette (#EEF0E5, #91E1F4, #3BB4D9, #009096, #003346)
- Tempered Study color palette (#D8F8FA, #90D6C9, #38B0B9, #00693B, #003C34)
- Worn Lagoon color palette (#D3E2DF, #459FA1, #00545C, #00302B, #00171D)
- Patina Quarry color palette (#EFF7F6, #D4DCEC, #769FB9, #237C86, #3B566A)
- Weathered Sapphire color palette (#C0E7E7, #239466, #2767C4, #005738, #00255C)
- Pine Field color palette (#C9ECEA, #008142, #00697F, #614900, #002710)
Browse the whole catalog at Explore, or see today's palette.