Petrol Drift color palette — #F1F6FC · #DCD9E1 · #C5BBC8 · #5A769B · #43484F

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

The five colors

• Ivory (#F1F6FC): a clean, paper-quiet neutral.
• Silver (#DCD9E1): a clean, paper-quiet neutral.
• Stone (#C5BBC8): A luminous, dusty pink — the color of a candy shop window.
• Slate (#5A769B): A full-bodied, dusty blue — the color of deep harbor water.
• Charcoal (#43484F): quiet, heavy and certain.

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

Use it as a design system

One click turns Petrol Drift 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

• Wandering Driftwood color palette (#EBF5FF, #AEB7D4, #8A7B9B, #496A66, #2D5160)
• Weathered Dune color palette (#F5F0F5, #DDD4D5, #CAB7B8, #5374B1, #322931)
• Aged Pier color palette (#F6F4FB, #E2D5DB, #C1ACBC, #824F7B, #3C3845)
• Aged Meadow color palette (#EEF9EF, #8BBCA8, #5F7D55, #505875, #2C493E)
• Tempered Navy color palette (#DBE2ED, #A4A8BD, #807A99, #183077, #081426)
• Patina Summit color palette (#DEE4F6, #6C64B5, #332E47, #1B1E2B, #0B0B14)
• Hushed Ultramarine color palette (#F1F5FF, #D0D0E6, #ABA1BD, #4848B6, #2A3246)
• Tempered Mulberry color palette (#E5E1EC, #C1B4C2, #9F8595, #731957, #231B2C)

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