Skip to contentEnma

Enma

One core, six themes. Draws out the best in every project.

The idea

Enma is one core with six themes on top. The core (spacing, type scale, components, states, motion, accessibility and the rules) never changes. A theme changes only the surface: color, fonts, radius, depth and how presses feel. Every screen built with Enma should feel calm, precise and a little bit crafted, whichever theme it wears: big tabular numbers, smooth corners, spring presses, one hero per screen, one accent spark per view and one primary button per view.

Start from the default for the project type. Override only with a reason. Every theme ships both modes.

Which theme to use for which project
Project typeThemeHome modeFeel
B2B SaaS, dev tools, dashboards, internal toolsgraphitedarkPrecise instrument. Mono numerals, one electric lime signal.
Consumer iOS-style apps, lifestyle, wellnessglasslightFrosted, layered, very round. Coral spark.
Learning, reading, writing, contentpaperlightEditorial. Italic serif numbers, hairline rules, sharp corners, one vermilion mark.
Finance, premium, trust-heavy, client workminerallightCalm and grounded. Forest hero, brass accent on sage.
Playful side projects, landing pages, socialenamellightLoud on purpose. Ink outlines, hard offset shadows, yellow and pink.
Fitness, media, night-time useemberdarkCinematic. A warm light source, amber on the key numbers and actions.

Tweak budget: a project may change three things inside a theme, the accent color, the display font and the radius dial. Anything bigger is a new theme.

Start here

Guides by platform

Samples

↑ ↓ to move, Enter to open, Esc to close

Keyboard shortcuts

Open the command palette
Ctrl then K
Search
/
Show keyboard shortcuts
?
Close the top overlay
Esc
Go to Home
G then H
Go to Themes
G then T
Go to Playground
G then P
Go to Components
G then C
Go to Guides
G then G
Go to Samples
G then S