Tempered Petrol color palette — #DBF5ED · #5F9AB3 · #5C66A0 · #5E404C · #4D2F0E

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

The five colors

• Honeydew (#DBF5ED): A whisper-light, dusty teal — the color of sea glass.
• Slate Blue (#5F9AB3): A luminous, dusty blue — the color of a favorite pair of jeans.
• Slate (#5C66A0): A full-bodied, balanced violet — the color of a velvet chair.
• Cocoa (#5E404C): A full-bodied, dusty rose — the color of strawberry cream.
• Espresso (#4D2F0E): A deep, shadowed, dusty gold — the color of honey in a jar.

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

• Turquoise Pier color palette (#D5F7E9, #23AFC2, #486488, #593E51, #45283D)
• Weathered Summit color palette (#CEE5E7, #4F9BCD, #685B85, #355135, #4F3303)
• Worn Terrace color palette (#D3F0DD, #60A4B4, #575C8A, #284226, #2D1A00)
• Wandering Basalt Meadow color palette (#DFF0E4, #72ADBD, #9E7890, #765737, #52320D)
• Patina Cobalt Workshop color palette (#D9F1FC, #4B70B5, #623870, #2B2B00, #061A04)
• Washed Dune color palette (#EEF6FF, #C4CCEA, #968EA3, #5F726C, #385356)
• Linen Cobalt Cabin color palette (#C6E2FB, #0085CE, #8F5F00, #004D7A, #3A2400)
• Iris Coast color palette (#DCEEF8, #8A97FF, #8F5A84, #4B521B, #1D3F22)

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