Pine Field color palette — #FFF1D4 · #9CB270 · #00885E · #005C60 · #003E5F

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

The five colors

• Custard (#FFF1D4): A whisper-light, dusty gold — the color of old brass.
• Sage (#9CB270): A luminous, balanced green — the color of fresh herbs.
• Fern (#00885E): A full-bodied, balanced teal — the color of shallow lagoons.
• Peacock (#005C60): A full-bodied, dusty teal — the color of sea glass.
• Navy (#003E5F): A deep, shadowed, balanced blue — the color of deep harbor water.

Feels like: Nature, Growth, Trust, Stability, Calm, Balance. Tagged cool.

Use it as a design system

One click turns Pine Field 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 Workshop color palette (#F9F3C5, #77B990, #008185, #005772, #263372)
• Olive Grove color palette (#FFEDDD, #BEAE65, #4C8D27, #006246, #00494D)
• Washed Pier color palette (#DEFCBA, #76C485, #298E6C, #00564E, #00292E)
• Linen Mint color palette (#EEF3C1, #B2DBAB, #65C299, #009692, #004253)
• Moss Thicket color palette (#FFF2EE, #8BA252, #00797D, #6D3A57, #3C3E37)
• Pale Emerald color palette (#E9ECDA, #00AC48, #006D60, #004252, #002361)
• Tempered Villa color palette (#F6F5EF, #D3E0D8, #B0C7C2, #697C51, #49483D)
• Pale Aubergine Grove color palette (#B9FFCA, #00B9A0, #00788D, #00439E, #390492)

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