Tempered Petrol color palette — #F1E7DD · #92BEB0 · #4B69A8 · #004A51 · #140E35

Slate takes the lead with Deep Indigo close behind in a set that reads as trust and stability at first glance.

The five colors

• Parchment (#F1E7DD): bright and airy, almost weightless.
• Ash (#92BEB0): A luminous, dusty teal — the color of glacier melt.
• Slate (#4B69A8): A full-bodied, balanced violet — the color of a velvet chair.
• Deep Teal (#004A51): A deep, shadowed, dusty blue — the color of a favorite pair of jeans.
• Deep Indigo (#140E35): A deep, shadowed, dusty violet — the color of wild irises.

Feels like: Trust, Stability, Creativity, 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 Veranda color palette (#EDF0E5, #90BCAE, #1D6BB0, #004C65, #122D55)
• Tempered Parlor color palette (#F2E6E0, #78C2C1, #00788D, #004E2E, #001827)
• Sapphire Thicket color palette (#FDEFE3, #81C4ED, #286ED1, #005154, #150351)
• Antique Cerulean Studio color palette (#FFEEE6, #8DDFED, #158EBD, #006451, #00254C)
• Hushed Azure Archive color palette (#EBF8F8, #D3DBF9, #5996D5, #006585, #011C46)
• Hushed Emerald color palette (#DBE8D8, #009C6A, #006958, #004042, #001D23)
• Antique Denim color palette (#EFE1D8, #4994B2, #004C81, #002C2A, #01001D)
• Hushed Study color palette (#F6F1EB, #C9E2E5, #8B9BC6, #2F7683, #462E3A)

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