Tempered Petrol color palette — #D7EAF5 · #7DA4C7 · #6477A1 · #4A445B · #2F213A

Built around Slate, softened by Blue Fog — the whole palette hums with trust and stability.

The five colors

• Frost (#D7EAF5): A whisper-light, dusty blue — the color of deep harbor water.
• Blue Fog (#7DA4C7): A luminous, dusty blue — the color of a favorite pair of jeans.
• Slate (#6477A1): A full-bodied, dusty violet — the color of wild irises.
• Charcoal (#4A445B): A full-bodied, dusty violet — the color of wild irises.
• Deep Indigo (#2F213A): A deep, shadowed, dusty violet — the color of wild irises.

Feels like: Trust, Stability, Sophistication. Tagged vintage, retro, 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

• Wandering Stone Ridge color palette (#DCEBFF, #A4B2D0, #8288A3, #5F5067, #473346)
• Cobalt Field color palette (#CDE2F5, #5A80BF, #484C87, #362846, #200B27)
• Cocoa Archive color palette (#CFE9D6, #8BB6A8, #7278A4, #7B3E1E, #3D3B34)
• Timeworn Azure color palette (#DAE8F2, #129FF6, #006BC4, #17437E, #121F40)
• Lilac Veranda color palette (#D7DEF6, #9A8CEF, #765791, #652F36, #400903)
• Aged Study color palette (#E9D5FF, #CA99CD, #986785, #784934, #3E1F2B)
• Powdered Delta color palette (#EDF1FF, #879FFF, #4E60BA, #1F276A, #08072E)
• Dusty Ash Studio color palette (#E9E5FE, #B485A2, #7E4F5F, #53303E, #2C1D00)

Browse the whole catalog at Explore, or see today's palette.