Tempered Petrol color palette — #E8F5F6 · #4F9D8C · #42699B · #753D4E · #061D17

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

The five colors

• Ivory (#E8F5F6): a clean, paper-quiet neutral.
• Fern (#4F9D8C): A luminous, balanced teal — the color of glacier melt.
• Slate (#42699B): A full-bodied, balanced blue — the color of a favorite pair of jeans.
• Cocoa (#753D4E): A full-bodied, balanced red — the color of late-summer berries.
• Ink (#061D17): A deep, shadowed, dusty teal — the color of sea glass.

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

• Muted Lagoon Study color palette (#E8F5F5, #579C71, #007B7C, #61436F, #26131A)
• Wandering Archive color palette (#E8F5F3, #7FA97C, #5D70A0, #703B2F, #3B2000)
• Aged Cobalt Veranda color palette (#E6F4FF, #2181B6, #7B417D, #5F3700, #01191F)
• Washed Mulberry color palette (#F1F7EE, #6BAB9B, #5E89B8, #8F4D62, #33322B)
• Ultramarine Chapel color palette (#E3F5FF, #007CA0, #3249C4, #72001D, #071400)
• Washed Summit color palette (#E2F1F4, #00978E, #2D3E48, #142123, #060E0E)
• Antique Harbor color palette (#F6F6E9, #9ABF7C, #4B98A4, #8E644C, #292212)
• Aged Coast color palette (#EFF8EF, #A48658, #815690, #7B2D4B, #412D39)

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