Tempered Petrol color palette — #FCE7F3 · #84C1D7 · #1768B4 · #003F34 · #020013

A conversation between Royal Blue and Sky, giving this palette its sense of trust and stability.

The five colors

• Blush (#FCE7F3): A whisper-light, dusty pink — the color of a candy shop window.
• Sky (#84C1D7): A luminous, dusty blue — the color of a favorite pair of jeans.
• Royal Blue (#1768B4): A full-bodied, balanced blue — the color of deep harbor water.
• Forest (#003F34): A deep, shadowed, dusty teal — the color of sea glass.
• Ink (#020013): A deep, shadowed, dusty violet — the color of a velvet chair.

Feels like: Trust, Stability, Calm, Balance. 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

• Muted Loft color palette (#F4EBF4, #6CC9C2, #007389, #0A4103, #000308)
• Gentle Cobalt Archive color palette (#FFF1F6, #9ED3F8, #5774CB, #00514F, #12002B)
• Worn Navy color palette (#EBDBD1, #469BB8, #004A87, #003127, #0F053E)
• Cobalt Pier color palette (#E9E1D6, #7ABBD2, #008CCA, #006C6F, #00142D)
• Chestnut Boulevard color palette (#F0DFD3, #9A5100, #006182, #004964, #030100)
• Rust Quarry color palette (#FBDCED, #C85700, #007293, #632700, #000102)
• Dusty Cypress color palette (#FBF2F7, #D7D4E0, #84A8DC, #008172, #2C294C)
• Softworn Lagoon Pier color palette (#F8F3F9, #D2D5E6, #8BC5D8, #5C915D, #28415A)

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