Pine Canyon color palette — #E9F6EB · #ACBA8F · #3F865D · #53516E · #162C26

Fern and Sage set the tone — five colors that lean into nature and growth.

The five colors

• Cream (#E9F6EB): bright and airy, almost weightless.
• Sage (#ACBA8F): A luminous, dusty green — the color of new leaves after rain.
• Fern (#3F865D): A full-bodied, balanced teal — the color of sea glass.
• Charcoal Brown (#53516E): A full-bodied, dusty violet — the color of a velvet chair.
• Deep Forest (#162C26): A deep, shadowed, dusty teal — the color of glacier melt.

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

Use it as a design system

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

• Ancient Station color palette (#E8F5F2, #88BEC3, #1C848E, #604D67, #0B2D2F)
• Weathered Pewter Lagoon color palette (#EDF8F1, #ADB586, #637C53, #665263, #324840)
• Dusty Pine color palette (#EBF5ED, #98A870, #007844, #574318, #00221A)
• Worn Lagoon Loft color palette (#FBF4E9, #BACD93, #649E7B, #896671, #43433B)
• Gentle Olive color palette (#CEFEEE, #B5C47C, #748000, #384900, #121800)
• Hushed Field color palette (#FBEBE1, #D5A35E, #8C7E00, #3B5800, #003733)
• Washed Hollow color palette (#D5E9DC, #5E863F, #00513B, #332900, #000A08)
• Tempered Iris color palette (#E5F7F0, #9FAD54, #7784DF, #606C00, #1A2643)

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