A quick guide for documenting your design system with Supernova
Document your design system with our powerful editor and integrate your Supernova design system data to keep your documentation always up to date the latest changes.
Collaboratively write and maintain your documentation, completely customize the appearance of your documentation site, and publish and share your documentation.
The following features are included in the documentation editor:
To open the documentation editor:
Documentation files are Figma files whose frames have been used inside your documentation. You can add Figma frames using the Figma frames block, or in the documentation settings.
Add documentation files:
— or —
Update or remove documentation files:
The documentation editor behaves like any familiar document text editor (such as Google Docs, Microsoft Word, or Notion). You can type anywhere, select text, copy and paste, and add rich content blocks that include information about your design system.
Highlight and format text using the rich text editor
In additional to the standard rich text formatting options, you can also change the type of text block, easily click to switch between header types, and add links.
Switch between block types fom the rich text bar
A block is any kind of content you add to the page, such as text, lists, quotes, dividers, or media. You can move blocks around on the page to reorder your information.
What is a block?
Blocks can utilize your design system data in unique ways
Expand your options for documentation using custom content blocks
Configure your docs using custom exporter properties
To publish your documentation:
Make your documentation site publicly available to everyone, without password protection.
This documentation was created using Supernova's fully customizable documentation engine. Start building your docs now!
© 2022 Supernova.io