Tempered Petrol color palette — #EFF7FA · #99C8DF · #9E698F · #007A8F · #312A3A

Teal takes the lead with Dusty Rose close behind in a set that reads as trust and stability at first glance.

The five colors

• Ivory (#EFF7FA): bright and airy, almost weightless.
• Sky (#99C8DF): A luminous, dusty blue — the color of open sky before noon.
• Dusty Rose (#9E698F): A full-bodied, balanced pink — the color of peonies in June.
• Teal (#007A8F): A full-bodied, balanced blue — the color of deep harbor water.
• Onyx (#312A3A): A deep, shadowed, dusty violet — the color of wild irises.

Feels like: Trust, Stability, Creativity, 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

• Washed Iris Corridor color palette (#ECF4F1, #93CBF0, #8776B9, #2F79A3, #1F1118)
• Timeworn Cobalt color palette (#F2F5FB, #ABC2E3, #A46F55, #446AB7, #372931)
• Lilac Courtyard color palette (#F0F6FB, #9FDAFF, #AD8ACC, #4F95BE, #2D2D37)
• Forest Courtyard color palette (#E4FBF8, #6DB4C2, #74719F, #316834, #374A5A)
• Mulberry Summit color palette (#E8F8FF, #A1C3E8, #7D81B8, #73427F, #702646)
• Weathered Blush color palette (#F0F5FF, #B4F3FF, #B6D1FF, #CD769F, #454862)
• Patina Villa color palette (#F1F6FB, #DBD9DF, #B5A8A6, #6385AB, #4D535A)
• Plum Lantern color palette (#ECF7FF, #12ADF4, #B60061, #005D86, #26152D)

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