Working with tokens

Learn how to create, edit, group and delete your design tokens.

View all design tokens

In the Design tokens section, you can see a list of all the tokens you have created or imported to Supernova. Tokens imported from Figma are marked with a Figma icon. In this view, tokens are organized by type.

You can search tokens by type, and manually add new Supernova tokens.

Design tokens / Types

View design tokens by collection

If you've imported Figma variables, you can view tokens organized by collection by selecting the Collections tab. This view mirrors how tokens and variables are displayed in Figma, presenting only the relevant themes for each collection instead of showing all themes in your design system.

Tokens are grouped by file and then by collection, making it easier to navigate. Additionally, you can search for tokens within a specific collection for quicker access.

Design tokens / Collections

To get started using collections view, see Importing Figma variables.

Design tokens / Collections / No Collections (only)