Tempered Petrol color palette — #F7EBE5 · #76C7C3 · #007486 · #004122 · #000306

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

The five colors

• Cream (#F7EBE5): a clean, paper-quiet neutral.
• Mint Leaf (#76C7C3): A luminous, dusty teal — the color of glacier melt.
• Teal (#007486): A full-bodied, balanced blue — the color of deep harbor water.
• Forest (#004122): A deep, shadowed, balanced teal — the color of sea glass.
• Ink (#000306): quiet, heavy and certain.

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

• Cerulean Harbor color palette (#FFF2EC, #92D9E5, #0085B1, #005342, #000D20)
• Gentle Sapphire Quarry color palette (#FBEBDE, #81C0E2, #0064C6, #003E3F, #020013)
• Aged Lagoon Atelier color palette (#EEE4EF, #419A96, #005265, #022E05, #00040D)
• Antique Teal Workshop color palette (#CFE7E1, #49C6C1, #00959B, #006F5F, #00181B)
• Gentle Alley color palette (#E0ECFB, #0066C0, #7D4B00, #4A4400, #000104)
• Linen Peony Meadow color palette (#E3F0FF, #C7C0FF, #D771B7, #00607A, #030123)
• Turquoise Workshop color palette (#FFF2EC, #C0FBFF, #00AAD4, #007555, #002743)
• Worn Thicket color palette (#C6E6EE, #0091C0, #005A9C, #120085, #010009)

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