Pine Lantern color palette — #F0F8F1 · #92B9AC · #48825D · #774960 · #2E4940

A conversation between Fern and Coffee, giving this palette its sense of nature and growth.

The five colors

• Ivory (#F0F8F1): bright and airy, almost weightless.
• Sage (#92B9AC): A luminous, dusty teal — the color of sea glass.
• Fern (#48825D): A full-bodied, balanced teal — the color of glacier melt.
• Coffee (#774960): A full-bodied, dusty rose — the color of strawberry cream.
• Forest (#2E4940): 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 Lantern 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 Study color palette (#EDF8F2, #75A6A0, #007363, #5F3D60, #043E3A)
• Washed Driftwood color palette (#FDF2F6, #ADC8B9, #708A64, #5A6582, #3D5347)
• Aged Cabin color palette (#F3F3E4, #B0B890, #348668, #475477, #262A14)
• Chalky Plum Boulevard color palette (#F9F2FF, #C78BA6, #3F9D7D, #A82C73, #0E4E3B)
• Weathered Driftwood Pier color palette (#F7F3FF, #EBD7DB, #D5C591, #8173A9, #534356)
• Softworn Basalt color palette (#FBF5E6, #C0E1AE, #7EBBA4, #A58888, #464500)
• Hushed Coast color palette (#D2EAE1, #448B62, #00504D, #4C1243, #002210)
• Hushed Balcony color palette (#FEF0FF, #BC6E77, #348F5F, #00726C, #462E48)

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