Presets Spruce Cabinet

Spruce Cabinet

Steady CRM interface: deep harbor green actions on cool green-grey neutrals, with DM Serif Display page titles and DM Sans data.

Pro Use in Figma Get the files
Spruce Cabinet across ten UI tiles: hero, phone screen, type, chart, palette, form, alerts, pricing, chat and buttons

A picture of the Pro preset. See it live, in light and dark, with UIX Pro.Unlock

Spruce Cabinet full preview: colour ramps, light and dark tokens, type scale, components in every state and six product screens

Use Spruce Cabinet

In Figma

Open UIX, go to Presets and search “Spruce Cabinet”. Press Use this preset, then Sync to Figma.

Install UIX

In code

A Tailwind v4 and shadcn/ui theme, W3C tokens, Figma variables and a DESIGN.md. Included with UIX Pro.

Unlock with UIX Pro

Send to your AI agent

Connect the UIX MCP once, then ask Claude Code, Cursor or any MCP client: “Use the Spruce Cabinet preset”.

Get your MCP link

About Spruce Cabinet

Steady CRM interface: deep harbor green actions on cool green-grey neutrals, with DM Serif Display page titles and DM Sans data.

Spruce Cabinet is one of the Pro presets in UIX. Its tokens, theme files and DESIGN.md come with UIX Pro: in Figma, in code, and through the UIX MCP for AI coding agents.

Access
UIX Pro
Industries
crm, financial services, professional services
Mood
institutional, trustworthy, calm, precise
Display font
DM Serif Display
Body font
DM Sans
Mono font
DM Mono
Density
Comfortable
Contrast
High
Corner radius
8px

Similar presets

All 251 presets →