You can now collect related components together and assign them different properties by using Component Variants. This helps developers to quickly access different variants of components—simplifying their Connected Components setup and even generating code snippets from variants.
Organize components in your styleguide by variants
You can collect variants of your components under sections and create properties to represent variants.
Quickly view Component Variants within a design
As developers inspect designs, when they select a component, they can view its properties on the right panel. More importantly, using the variant pop-up, they can also view and inspect other variants (specifically state variants) of the component using the shortcut
Document when and how to use variants in the context of a design
Using smart variant links in notes, you can document when and how to use component variants in the context of a design.
- Setting up Component Variants from Figma
- Setting up Component Variants manually
- Setting up Component Variants from Sketch
- Setting up Component Variants from Adobe XD
- Document when and how to use Component Variants