Tempered Petrol color palette — #FFF4E2 · #4DA6B6 · #3A6DA1 · #773738 · #284437

Built around Slate, softened by Rust — the whole palette hums with trust and stability.

The five colors

• Cream (#FFF4E2): A whisper-light, dusty gold — the color of afternoon light on wheat.
• Cyan (#4DA6B6): A luminous, balanced blue — the color of open sky before noon.
• Slate (#3A6DA1): A full-bodied, balanced blue — the color of open sky before noon.
• Rust (#773738): A full-bodied, balanced orange — the color of autumn markets.
• Forest (#284437): A deep, shadowed, dusty teal — the color of sea glass.

Feels like: Trust, Stability, Calm, Sophistication. Tagged retro, muted, cool.

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

• Azure Summit color palette (#FFF4E2, #569FD5, #63639A, #70401F, #4A354A)
• Teal Coast color palette (#FFF4E2, #60A988, #067880, #653E5F, #33432A)
• Cerulean Balcony color palette (#EAFAF0, #2197B3, #73538E, #703420, #2C3F15)
• Aged Teal Ridge color palette (#FFEFDE, #52AF9A, #446D9D, #633C00, #0B2A15)
• Cobalt Ridge color palette (#E9FBE9, #77C3AC, #4F8BC3, #875800, #194350)
• Tempered Cypress Ridge color palette (#F9F4EE, #CBE4CF, #5A94A5, #267062, #214D63)
• Misty Basin color palette (#FAE2B0, #0088B9, #3431CB, #612100, #002A4C)
• Hushed Bloom color palette (#D7EAE1, #007BA7, #3E2A3E, #12231C, #040F0D)

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