Tempered Amber color palette — #F5F3FF · #D7B1DF · #BB775A · #3D784B · #20293C

Caramel and Olive set the tone — five colors that lean into nature and growth.

The five colors

• Ivory (#F5F3FF): a clean, paper-quiet neutral.
• Lavender (#D7B1DF): A luminous, dusty pink — the color of a candy shop window.
• Caramel (#BB775A): A luminous, balanced orange — the color of sun-warmed clay.
• Olive (#3D784B): A full-bodied, balanced green — the color of a quiet forest floor.
• Midnight (#20293C): A deep, shadowed, dusty violet — the color of wild irises.

Feels like: Nature, Growth, Optimism, Creativity, Sophistication. Tagged jewel, vibrant, muted.

Use it as a design system

One click turns Tempered Amber 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

• Hushed Quarry color palette (#FAF2FC, #E9ABB6, #A3954E, #007478, #282436)
• Blush Basin color palette (#EFF6FF, #99B4E7, #C07490, #656823, #132532)
• Cypress Bloom color palette (#EAF9F4, #DED6FF, #C88EA7, #308275, #3F3C52)
• Powdered Amber Study color palette (#FFF1F6, #CC7600, #5E7400, #004269, #0B0002)
• Aged Mallow Lantern color palette (#F7F3FF, #D398C4, #5E4E5F, #2E2738, #0E0E16)
• Antique Hollow color palette (#EEF1FF, #9881D3, #A1585F, #125A68, #131A24)
• Weathered Iris color palette (#FFF0F8, #8E73C8, #627641, #45532D, #2E3A31)
• Patina Coral color palette (#FFF0FD, #D36764, #8B6500, #004F4F, #0A031E)

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