Softworn Petrol color palette — #F1F7F0 · #59A8A1 · #2A77AA · #584A7A · #3D4900

Slate and Deep Olive set the tone — five colors that lean into nature and growth.

The five colors

• Ivory (#F1F7F0): a clean, paper-quiet neutral.
• Turquoise (#59A8A1): A luminous, dusty teal — the color of shallow lagoons.
• Slate (#2A77AA): A full-bodied, balanced blue — the color of a favorite pair of jeans.
• Charcoal Brown (#584A7A): A full-bodied, dusty violet — the color of twilight just after sunset.
• Deep Olive (#3D4900): A deep, shadowed, balanced green — the color of fresh herbs.

Feels like: Nature, Growth, Trust, Stability, Creativity, Balance. Tagged 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

• Aged Cobalt color palette (#EDF8F3, #4EA3CA, #6768AA, #703F69, #34492E)
• Washed Petrol color palette (#F2F7EC, #66A88B, #007F8F, #305485, #573744)
• Tempered Turquoise Veranda color palette (#F5F6EF, #C8E6DF, #56A7B5, #337C76, #43594C)
• Ash Alley color palette (#EBFAE9, #B2CCB9, #7B9E8E, #806674, #614844)
• Hushed Ridge color palette (#F1F3E7, #6BAF6B, #626EA0, #6B3B47, #3B1E18)
• Muted Hollow color palette (#E5FCEE, #008CA8, #2E45CA, #640079, #003A2C)
• Aged Seafoam color palette (#F2F8EA, #C4F8C4, #4EE1B3, #4CABA5, #3E4936)
• Mint Bloom color palette (#EBF8F7, #85C388, #8088BA, #885966, #503950)

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