Pine Pier color palette — #E9F6EC · #9EA575 · #42723B · #06524D · #002318

Built around Olive, softened by Sage — the whole palette hums with nature and growth.

The five colors

• Cream (#E9F6EC): a clean, paper-quiet neutral.
• Sage (#9EA575): A luminous, dusty green — the color of new leaves after rain.
• Olive (#42723B): A full-bodied, balanced green — the color of new leaves after rain.
• Forest (#06524D): A deep, shadowed, dusty teal — the color of sea glass.
• Onyx (#002318): A deep, shadowed, dusty teal — the color of shallow lagoons.

Feels like: Nature, Growth, Sophistication, Grounding. Tagged botanical, earthy, muted.

Use it as a design system

One click turns Pine Pier 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

• Softworn Cypress color palette (#E3F7F2, #7EAC93, #20736C, #394E26, #002122)
• Patina Forest color palette (#DAF1E4, #7A995D, #16653E, #422D5A, #0A1600)
• Pine Parlor color palette (#DFFAE7, #9EB168, #407A47, #4F4274, #1D2400)
• Forest Dune color palette (#DDF0E4, #6C814B, #005226, #003132, #050A00)
• Aged Quarry color palette (#F8F6E6, #D5D3A6, #709664, #5B6B27, #2B290D)
• Dusty Lagoon color palette (#FEF4E4, #BFB58A, #628E5B, #2A706A, #37352F)
• Cobalt Atelier color palette (#EEF4ED, #ACCBEA, #6378BA, #005967, #21193C)
• Hushed Grove color palette (#E8F3FF, #D3CDFF, #CF96C1, #347B89, #1A263D)

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