Softworn Petrol color palette — #ECF4F1 · #DCD0CE · #C7B5B6 · #417CA1 · #232F2B

A conversation between Slate and Stone, giving this palette its sense of trust and stability.

The five colors

• Ivory (#ECF4F1): bright and airy, almost weightless.
• Oat (#DCD0CE): bright and airy, almost weightless.
• Stone (#C7B5B6): A luminous, dusty red — the color of a theater curtain.
• Slate (#417CA1): A full-bodied, balanced blue — the color of a favorite pair of jeans.
• Deep Forest (#232F2B): quiet, heavy and certain.

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

Use it as a design system

One click turns Softworn 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

• Petrol Parlor color palette (#F0F6FA, #DBDAE4, #C8BBCE, #457C95, #3F4950)
• Hushed Bloom color palette (#F7F0F3, #E5D2CE, #D8B5B8, #7158B1, #341C28)
• Pewter Cabin color palette (#F8F1E7, #C1B28C, #707B4E, #255D6E, #312607)
• Patina Cobalt Canyon color palette (#EDE1EB, #5B72AF, #412835, #200F1D, #000906)
• Washed Chestnut color palette (#F7E3F8, #CCB4C2, #A47C84, #6B502B, #3C3A33)
• Turquoise Lantern color palette (#F0F7F4, #DED4D1, #A4A095, #67A7C9, #34433D)
• Antique Navy Quarry color palette (#E0EFEB, #AA9BA6, #8C7380, #003764, #000604)
• Tempered Petrol Alley color palette (#FBF0E0, #71A1CC, #6660A7, #6C3600, #2F1A2E)

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