Tempered Petrol color palette — #F7EFF4 · #DEB5CD · #977F4F · #6C6AA2 · #1C1408

Built around Slate, softened by Mocha — the whole palette hums with optimism and creativity.

The five colors

• Ivory (#F7EFF4): a clean, paper-quiet neutral.
• Carnation (#DEB5CD): A luminous, dusty pink — the color of a candy shop window.
• Mocha (#977F4F): A luminous, dusty gold — the color of afternoon light on wheat.
• Slate (#6C6AA2): A full-bodied, balanced violet — the color of twilight just after sunset.
• Ink (#1C1408): A deep, shadowed, dusty gold — the color of afternoon light on wheat.

Feels like: Optimism, Creativity, Sophistication. Tagged duotone, 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

• Weathered Petrol Villa color palette (#F6EFF6, #ACC5EC, #B06C77, #4F72A9, #20110E)
• Timeworn Coast color palette (#FBF2F5, #CFB4E2, #AD666C, #83589D, #3B2924)
• Tempered Cabin color palette (#FCEEEC, #E49AB6, #65802F, #954567, #100F02)
• Chestnut Study color palette (#F1F0FF, #D3B2D6, #AB7382, #814436, #3E2600)
• Iris Garden color palette (#F3F5FB, #CFCBF7, #BE925C, #8A7CDB, #253224)
• Ash Orchard color palette (#F2F4E0, #B1A1D4, #9E676B, #155C64, #3B2528)
• Weathered Delta color palette (#FDEEED, #C784A6, #4A7E68, #1E5842, #102F15)
• Coral Market color palette (#F4F4FC, #E7D8E0, #E39791, #AB8BC0, #251A24)

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