Screens

Overview

Your workspace at a glance: its Brands, their token sets and themes, what is live, and what to do next.

What it’s for

Overview is home. It lists every Brand in the workspace you’re in, with its token sets and themes, and shows what is live and what is waiting. It’s where you create Brands, bring tokens in and propose releases.

The numbers under the title count your Brands, the releases waiting for review, and the releases that are out.

Getting started checklist

Until your workspace is up and running, Overview suggests the next two or three things to do: create a Brand, bring tokens in, propose and approve a release, invite a reviewer, add a component, connect a tool. Each ticks itself off when it’s done, wherever you do it.

Nothing is locked behind it. It only suggests what usually comes next.

Tip: Not ready with your own tokens? Try Stoaken with a sample Brand builds a small design system called Acme, with v1.0.0 already live and v1.1.0 waiting for your review, so you can feel the whole flow in a minute.

Brands

Each Brand has a card. Its mark and name, how many token sets, themes and components it has, and, if it builds on another Brand, which one.

  • New Brand (top right) creates one. Give it a name and, if you like, a logo, icon or emoji. It starts with a Default theme.
  • Bring your tokens (or Add a token set once it has some) brings tokens in: upload a JSON file, paste JSON, or bring a Tailwind config.
  • The ⋯ menu holds Rename, Change mark and Delete Brand, when your role allows them.
  • The links along the bottom open the Brand in Tokenwright, Components and the Command Center.

Good to know: Deleting a Brand removes its tokens, themes, releases and comments for good. Only a workspace Owner can do it, by typing the Brand’s name. A Brand that another Brand builds on, or the workspace’s last Brand, can’t be deleted.

Token sets

A token set is a group of tokens kept together, such as core colours or typography. A Brand can have several; its themes decide which sets they stack.

  • Edit opens the set on the Tokens page.
  • Replace swaps the whole set for a new file, pasted JSON or Tailwind config. You confirm before it changes, and nothing reaches anyone until a release is approved.

Tip: Files can come from Tokens Studio, Style Dictionary, or Figma variables plugins: anything that writes the W3C design tokens format (.json), up to 1 MB.

Themes

A theme is a version of the Brand: a partner, a season, a product line. It stacks token sets in order; a later set overrides an earlier one. It can also have modes, such as light and dark.

  • Each theme shows how many sets it stacks, what is live (for example live v1.2.0), and how many releases are waiting or still drafts.
  • New theme starts one as a copy of your first theme, with or without its modes. Edit changes its name, its sets and their order.

Modes and the sets each mode turns on are set up in Tokenwright.

Proposing a release

Propose a release on a theme takes a snapshot of its tokens as they are now, compares it with what is live in every mode, and sends the differences to review.

  1. Pick the kind of change. Patch: a value nudged. Minor: something added; everything still works. Major: something renamed, removed or changed in meaning.
  2. Stoaken suggests the next version number; you can change it.
  3. Propose. The release waits in the Command Center until a reviewer approves or rejects it.

Good to know: A release that removes a token is a breaking change. Only an Admin or Owner can approve it.

Using the tokens in code

Use these tokens appears once a theme has something live. It gives you the live release as a file: CSS variables (alone or with light and dark), JSON (W3C or Style Dictionary v4), JavaScript, TypeScript, SCSS or a Tailwind config. It also shows the command to fetch the same file from CI.

Only published releases are exported. Unsaved edits and releases waiting for review never are.

Invitations and joining

If someone has invited you to another workspace, the invitation waits at the top of Overview: accept or decline it. If your company lets people join with their work email address, workspaces you can join show there too.

Who can do what here

Everyone
Sees every Brand they have access to, its sets, themes and what is live.
Editor
Brings tokens in, replaces sets, edits themes and proposes releases.
Admin
Also renames Brands and changes their marks.
Owner
Also deletes Brands.

If you don’t see a button described here, your role doesn’t include it. Ask an Admin on Members.

Looking for the API, CLI or AI agents? They’re in the developer docs.