Petrol Loft color palette — #F3EEE5 · #98BC9D · #00758A · #005143 · #003346
Built around Teal, softened by Forest — the whole palette hums with nature and growth.
The five colors
- Cream (#F3EEE5): bright and airy, almost weightless.
- Sage (#98BC9D): A luminous, dusty green — the color of a quiet forest floor.
- Teal (#00758A): A full-bodied, balanced blue — the color of open sky before noon.
- Forest (#005143): A deep, shadowed, dusty teal — the color of glacier melt.
- Deep Teal (#003346): A deep, shadowed, dusty blue — the color of open sky before noon.
Feels like: Nature, Growth, Trust, Stability, Calm, Sophistication. Tagged coastal, cool, light, muted.
Use it as a design system
One click turns Petrol Loft 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 Coast color palette (#F4EDE3, #87B9D1, #006DAB, #004F55, #132D54)
- Hushed Cerulean color palette (#F9F4ED, #B3CCBB, #3482A1, #00605A, #0C3E5E)
- Weathered Teal color palette (#D1E5DD, #00AA9D, #006C71, #00454F, #00303D)
- Ancient Periwinkle Courtyard color palette (#D6F9E3, #A7D5EF, #839EDE, #006A67, #003849)
- Misty Villa color palette (#E5F3E8, #8EE4E9, #00B7D7, #1F927C, #003346)
- Weathered Brick color palette (#CAE7D0, #008F9B, #BD273E, #00535B, #530012)
- Dusty Meadow color palette (#E7DFD4, #648B74, #00425C, #002222, #000A18)
- Worn Mulberry color palette (#D3F2DD, #00798A, #9A1590, #5E4B00, #00242B)
Browse the whole catalog at Explore, or see today's palette.