Tempered Petrol color palette — #F7EBE7 · #74C7CA · #007194 · #00411D · #00020B

Peacock and Forest set the tone — five colors that lean into nature and growth.

The five colors

• Cream (#F7EBE7): a clean, paper-quiet neutral.
• Aqua (#74C7CA): A luminous, balanced teal — the color of sea glass.
• Peacock (#007194): A full-bodied, balanced blue — the color of open sky before noon.
• Forest (#00411D): A deep, shadowed, balanced teal — the color of glacier melt.
• Ink (#00020B): A deep, shadowed, dusty blue — the color of a favorite pair of jeans.

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

• Frosted Ultramarine Summit color palette (#F6ECE5, #73C2E6, #0060D1, #003F37, #030011)
• Cobalt Alley color palette (#FFF2EB, #9DD6E7, #007FCC, #005340, #060232)
• Hushed Lagoon Lagoon color palette (#EEF0DD, #4C979D, #00535E, #002C29, #000508)
• Cerulean Courtyard color palette (#D9E5DB, #54C3CB, #0092AD, #006F5D, #001622)
• Worn Jade color palette (#AAF4D0, #00B262, #00653E, #001D0F, #000201)
• Quiet Azure Drift color palette (#F5F8CC, #69E4DF, #1BAEF7, #664F00, #000B06)
• Powdered Fern Loft color palette (#EFE3C3, #778600, #236800, #002A1B, #000605)
• Sky Pier color palette (#FCF3EF, #BDE9F5, #58B0E4, #248159, #3D253A)

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