All color themes
Works properly across all four color themes (lightest, light, dark, darkest).
Component blocks can be used in your documentation to display Supernova components in your design system, and different properties attached to them.
There are three component blocks to choose from: component health, component checklist, and component overview table.
Each component block shows a view of selected component properties. You can choose from the following properties to display:
The component health block shows a detailed view of a single component’s properties.
The component checklist block displays a table showing a selected component, and highlighting selected properties of the component.
The component overview table block displays all of the components linked in your design system in a table. You can select any properties you want to display in the table, and have an option to add the date of each component’s last update.
All color themes
Works properly across all four color themes (lightest, light, dark, darkest).
Is documented
The component is fully documented by our standards.
Accessible use of color
Color is not used as the only visual means of conveying information (WCAG 2.0 1.4.1).
In UI library
Is included in our Figma library UI library.
Figma component
Includes a link to a Figma component that has been imported to Supernova
Status
The component has a health status indicated
Component | Figma component | Status | Accessible use of color |
---|---|---|---|
Alert | Open in Figma | Needs attention |
|
Avatar | Open in Figma | Healthy |
|
Button Gradient | Open in Figma | Deprecated |
|
Button Positive | Open in Figma | Healthy |
|
Button Primary | Open in Figma | Healthy |
|
Button Secondary | Open in Figma | Healthy |
|