Petrol Market color palette — #F3F4FF · #D0C2F5 · #C68A6C · #00788E · #3C3155
Built around Teal, softened by Caramel — the whole palette hums with trust and stability.
The five colors
- Ivory (#F3F4FF): bright and airy, almost weightless.
- Lilac Frost (#D0C2F5): A whisper-light, dusty violet — the color of twilight just after sunset.
- Caramel (#C68A6C): A luminous, balanced orange — the color of autumn markets.
- Teal (#00788E): A full-bodied, balanced blue — the color of open sky before noon.
- Navy (#3C3155): A deep, shadowed, dusty violet — the color of a velvet chair.
Feels like: Trust, Stability, Optimism, Creativity, Sophistication. Tagged muted.
Use it as a design system
One click turns Petrol Market 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
- Cypress Basin color palette (#EEF6FE, #9DD2FE, #C48596, #007E5F, #1E3B54)
- Dusty Alley color palette (#FDF2F6, #EFC1A0, #BE8E6C, #007A7E, #542A29)
- Hushed Mallow color palette (#FFF2F1, #FBABCF, #CDA063, #599673, #274A40)
- Tempered Workshop color palette (#F5F3FF, #E6BBEA, #86A474, #53773C, #004339)
- Softworn Driftwood Studio color palette (#F1F5FF, #E1D8E1, #D7B7C1, #738FAA, #485061)
- Hushed Blush Boulevard color palette (#FAF2FD, #E294A8, #604F58, #312734, #100E14)
- Softworn Blush color palette (#F6EFFB, #D17EA5, #8E6A33, #235840, #12293E)
- Washed Coast color palette (#F9F2FE, #DD87AF, #9E6A00, #004F75, #370020)
Browse the whole catalog at Explore, or see today's palette.