Back to Plugins
Convert to Variant

Convert to Variant

<p>Select multiple instances and convert them into variants of their main component, then seamlessly swap the variants into your design.</p><p><br></p><p>Video Demonstration: <a href="https://youtu.be/YEsHiadBWhs" rel="noreferrer noopener nofollow ugc" target="_blank">https://youtu.be/YEsHiadBWhs</a></p><p><br></p><p><strong>How to Use</strong></p><ol><li>Select 1 or more instances which you have modified from the original component. (it works best if you have named them descriptively as the variant will use this name)</li><li>Right click and run the <strong>Convert to Variant</strong> plugin from your Plugin menu.</li><li>Enjoy your new variants, ready for you to reuse elsewhere in your design.</li><li>Tidy up your property name, the variations will be created in the first property which defaults to 'Property 1'</li></ol><p><br></p><p><strong>Requirements</strong></p><ul><li>Main Component must be local</li></ul><p><br></p><p><strong>Notes</strong></p><ul><li>Native 'Combine as Variants' feature is similar but the main difference is that this plugin creates the variants as children of the existing main component rather than under a new component. Cheers <strong>Alexandre Soares</strong> for sharing this feature.</li></ul>

convertvariantsinstancechangecode-generators

Plugin Preview

Convert to Variant preview

About this plugin

Select multiple instances and convert them into variants of their main component, then seamlessly swap the variants into your design.


Video Demonstration: https://youtu.be/YEsHiadBWhs


How to Use

  1. Select 1 or more instances which you have modified from the original component. (it works best if you have named them descriptively as the variant will use this name)
  2. Right click and run the Convert to Variant plugin from your Plugin menu.
  3. Enjoy your new variants, ready for you to reuse elsewhere in your design.
  4. Tidy up your property name, the variations will be created in the first property which defaults to 'Property 1'


Requirements

  • Main Component must be local


Notes

  • Native 'Combine as Variants' feature is similar but the main difference is that this plugin creates the variants as children of the existing main component rather than under a new component. Cheers Alexandre Soares for sharing this feature.

Plugin Details

Version1
CreatedApril 13, 2022
Last UpdatedApril 13, 2022
CategorySoftware development
CreatorJames McKennay
Stats337 installs, 27 likes
PricingFree

Technical Details

  • API:1.0.0
  • main:code.js
  • Editor Types:
    figma