Softworn Petrol color palette — #ECF9F4 · #DDC186 · #3F77A1 · #224B40 · #172521

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

The five colors

• Ivory (#ECF9F4): bright and airy, almost weightless.
• Sand (#DDC186): A whisper-light, balanced gold — the color of honey in a jar.
• Slate (#3F77A1): A full-bodied, balanced blue — the color of deep harbor water.
• Forest (#224B40): A deep, shadowed, dusty teal — the color of shallow lagoons.
• Onyx (#172521): A deep, shadowed, dusty teal — the color of sea glass.

Feels like: Trust, Stability, Optimism, Sophistication. Tagged luxury, dark, muted.

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

• Tempered Stone Archive color palette (#FEF0FA, #DDC186, #656E9B, #53384C, #2C1C27)
• Wandering Cobalt Basin color palette (#EDF6FF, #FDE2AA, #2F7DB2, #1D3B54, #06101A)
• Aged Azure Chapel color palette (#EEF6FF, #FFC7A8, #6298D9, #4C6582, #19222E)
• Denim Quarry color palette (#FAF2FB, #CDA58A, #255482, #112F4D, #2A1C2C)
• Iris Thicket color palette (#FAF3F7, #E1D7D7, #CCBCB8, #848BBF, #50434C)
• Wandering Cobalt color palette (#FAF2FA, #A5C6F6, #AA7BB7, #4F81C7, #311D22)
• Tempered Bronze color palette (#FCF1FB, #7193D4, #A8613D, #576729, #1C2C1D)
• Aged Powder color palette (#FFF4E2, #AAA9EC, #A074A2, #746219, #503340)

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