Edit your design system by looking at it

Everything a token set needs

• A specimen, not a spreadsheet

  Colour ramps with their lightness curve, semantic colours on the surfaces they sit on, spacing and radius to scale, type set in its own fonts, shadows and motion you can see.

• Every mode, editable

  Switch to Dark or Compact and see every value as it is there. Edit it and the change goes into that mode’s own set; a mode without one gets it in a click.

• A Table for the big jobs

  Thousands of tokens, grouped and virtualised. Pick a group or a range, then move, rename part of a name, deprecate or delete, with a warning for anything that would break.

• Find and replace

  Change a value everywhere it appears in a set, or point every match at a token instead.

• Problems surface themselves

  Text that’s too faint in any mode and references that don’t resolve are counted in the bar, one click from the token at fault.

• Every save is kept

  The last hundred saves of each set, from the app, the API, agents or the CLI. See what any of them would change and bring it back as unsaved edits.

• Undo after saving

  Saved something by mistake? Undo stays available for thirty seconds, with the same conflict check as a save.

• Start from Tailwind

  Paste a v3 config or a v4 @theme block. Stoaken keeps what you changed and remembers where each token came from.

• Talk about a token

  Comment on any token, watch the threads you care about, and get told when someone replies.

• Find anything with ⌘K

  Search the whole Brand by name, by colour (a hex or rgb() is enough), by type or set, including what nothing uses.

• Out to any stack

  CSS (with light and dark), JSON for the W3C format and Style Dictionary, JS, TS, SCSS, Tailwind, Swift, Compose and Android.