Design that disappears on purpose.
The foundations, components, and voice that keep Cloaked calm, trustworthy, and unmistakably ours — across iOS, Android, web, and everything we ship after that.
Everything you need to build Cloaked.
Pick up tokens, components, and guidance. Ship something calm, fast, and unmistakably ours.
Color
A 21-step neutral ramp, Firey orange for action, Ink for confirmation, and five tint families for everything else.
Typography
STK Bureau Sans for the workhorse, SF Pro on iOS, Roboto on Android, Simula for the editorial moments.
Spacing & radius
A 4px grid with a named scale, and radii that range from square data cells to full-pill CTAs.
Iconography
1.5px strokes, 24px grid, rounded ends. Icons whisper — they don't shout.
Buttons
Primary, Secondary, Tertiary, Text Mono — four types, four states, four sizes, one live playground.
Voice & tone
Calm, concrete, human. How we say things — and the dozen habits we've retired for good.
Six principles that do most of the work for us.
Calm beats loud
We deal in money, identity, and trust. Interfaces should slow the heart rate, not raise it.
Concrete beats clever
Say the real thing. “Your address was exposed on 3 sites” is better than “Oops, something happened.”
One primary action
One Firey button per screen. If two actions feel equal, one of them isn't ready to ship yet.
Data looks like data
Mono typefaces on anything machine-generated. Users should be able to see a number and trust it.
Soft corners, hard facts
Generous radii, small shadows, and a cream surface that makes our black type feel legible not heavy.
Good defaults, few knobs
Components arrive opinionated. Theme switches and feature flags are earned, not assumed.
What's new
Latest changes to tokens, components, and documentation.
Button pressed state unified updated
All four button types now use a 3px inset ring in surface color for the pressed state, replacing the old opacity shift. Matches Figma source.
Lavender family promoted new
Lavender moves from one-off avatar accent to full color family (100/200/300 + deep). Use it for personal data moments that aren't alerts.
Spacing scale extended to 120 updated
New --space-14 token for marketing hero rhythm. Nothing in product changes.
Text Mono button type new
Fourth button type for minimum-emphasis inline links — footnotes, privacy links, not-now actions.