Tempered Petrol color palette — #F0F6FB · #DADAE4 · #C2BDCD · #417AA2 · #404951

Slate and Stone set the tone — five colors that lean into trust and stability.

The five colors

• Ivory (#F0F6FB): a clean, paper-quiet neutral.
• Silver (#DADAE4): bright and airy, almost weightless.
• Stone (#C2BDCD): A luminous, dusty violet — the color of twilight just after sunset.
• Slate (#417AA2): A full-bodied, balanced blue — the color of deep harbor water.
• Charcoal (#404951): quiet, heavy and certain.

Feels like: Trust, Stability, Sophistication. Tagged scandi, muted, light.

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

• Aged Thicket color palette (#EBF3F9, #D9D7E5, #C3BAC7, #4E7C94, #272D32)
• Patina Orchard color palette (#F2F4FF, #E0D5E3, #C1B6D4, #7159A9, #3D3F4A)
• Worn Cerulean color palette (#EFF8F4, #E2D3CF, #A5A194, #6497B2, #414A46)
• Aged Navy color palette (#E8F0F8, #A0AABC, #757DA0, #00386A, #091521)
• Wandering Driftwood color palette (#EFF6FF, #A5ADC7, #9E7DA1, #526752, #335050)
• Ancient Iris Orchard color palette (#EFF6FF, #A8E0FF, #94C0FF, #9374BF, #303C57)
• Dusty Olive color palette (#EEF8EF, #B7B27F, #6B7C34, #415E6E, #2F493C)
• Antique Ultramarine Market color palette (#F0F6FD, #C9D2EA, #B09CCD, #194DC4, #293342)

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