Petrol Canyon color palette — #F1F5FF · #BFCB9A · #656CA7 · #3B3F64 · #1C212D

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

The five colors

• Ivory (#F1F5FF): a clean, paper-quiet neutral.
• Pistachio (#BFCB9A): A whisper-light, dusty green — the color of fresh herbs.
• Slate (#656CA7): A full-bodied, balanced violet — the color of a velvet chair.
• Navy (#3B3F64): A deep, shadowed, dusty violet — the color of wild irises.
• Onyx (#1C212D): A deep, shadowed, dusty violet — the color of wild irises.

Feels like: Nature, Growth, Creativity, Sophistication. Tagged luxury, dark, muted.

Use it as a design system

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

• Dusty Courtyard color palette (#F5F4FF, #97D0D3, #84648C, #52365A, #221F2E)
• Wandering Dune color palette (#EEF6FF, #E2B5CC, #50759A, #1E456A, #19232C)
• Hushed Thicket color palette (#FDF1FB, #C9F5B1, #5C75AA, #453142, #160B14)
• Aged Denim color palette (#FCF2F7, #C5AB75, #4F4880, #402334, #251718)
• Timeworn Bloom color palette (#F2F5FF, #F7D07B, #928DC4, #5B627A, #1E212D)
• Timeworn Basalt color palette (#F3EBFA, #96C290, #8B4B6B, #571C3D, #1C1024)
• Wandering Garden color palette (#F5F4FB, #E2D8DD, #CFBBBE, #A77CB7, #474654)
• Indigo Quarry color palette (#F2F5FD, #BABDFE, #BE7E4F, #736CE8, #331B27)

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