Where to start

The next steps to help you get started with Supernova.

Design systems in Supernova

Discover what you can do with your design system in Supernova and learn how to import your Figma design data.

Design systems 101

A guide to design systems in Supernova.

Managing your design system

Manage your design system data in Supernova.

Import design system data

Learn about importing data to Supernova.

Design system settings

Manage your design system in Supernova.

Learn about design tokens

Learn about what a design token is, the different types of tokens, and how they work in Supernova.

Tokens 101

Learn about design tokens in Supernova.

Types of tokens

Learn about token types in Supernova.

Working with tokens

Create, edit, and delete your design tokens.

Theme tokens

Expand your design system with themes.

Referencing tokens

Refer one token value to another.

Integrate with your tools

Import from Figma

Import design system data from Figma.

Import Figma variables

Import Figma variables with our plugin.

Import from Tokens Studio

Import styles with our Tokens Studio integration.

Import from Storybook

Connect Storybook to import your stories.

Document your design system

Learn how to use Supernova's powerful documentation editor, and discover the content blocks you can use to document your design system.

Documentation 101

Guide to documenting your design system.

Using the editor

How to use the documentation editor.

Documentation blocks

Add content blocks to your documentation.

Pages, groups and tabs

Add structure to your documentation site.

Customizing your documentation

Style your docs to match your brand.

Preview & publish

How to preview and publish your site.

Collaborate with your team

Learn how to best work with your team in Supernova when collaborating on design system documentation.

Page drafts

Edit multiple pages simultaneously.

Comments

Collaborate directly in the editor.

Approval workflows

Review changes before publishing.

Connect design and code

Read about how to keep your design system data in sync with production codebases by using our code pipelines.

Code automation

Keep your design system data in sync.

Creating code pipelines

Automate code delivery using pipelines.

Using exporters

Use exporters to automate code delivery.

Open a pull request

Open a pull request in a code pipeline.

Connect code integrations

Github

Connect a Github account.

Gitlab

Connect a Gitlab account.

Azure

Connect an Azure account.

Bitbucket

Connect a Bitbucket account.

Your Supernova workspace

Discover how to customize your workspace, invite and manage team members, and manage your billing and plan subscription.

Managing your workspace

Create resources with your team in a shared workspace.

Team members

Invite workspace members, manage seats, grant permissions, and more.

Billing

Manage your subscription, update payment methods, and more.

Security & login

Restrict access to authorized users, IP addresses and devices.

Account settings

Manage your personal details and account.

Design system roles

Configure design system access.