How Do You Make Variants in Figma?

Figma is a powerful design tool for creating and collaborating on user interfaces, mobile apps, websites, and other designs. It has become increasingly popular among designers due to its intuitive user interface and powerful features.

One of the great features of Figma is the ability to quickly create variants of designs. Variants are different versions of a design with slight changes, such as different colors or sizes. This makes it easy to test different ideas and get feedback from users or clients before committing to a final design.

Creating variants in Figma is fairly straightforward. First, create a master frame with the basic elements that you want to keep consistent across all your variants.

You can then duplicate this frame by clicking the ‘Duplicate’ button in the top right corner of the frame. This will create an exact copy of your frame. You can then make changes to this copy without affecting the original frame.

Once you have created your variant frames, you can easily switch between them using the Variants tab in Figma’s sidebar. This tab displays all your variants and allows you to quickly switch between them. You can also make changes to multiple variants at once by selecting them all and using the ‘Apply Changes’ command in Figma’s menu bar.

Figma also offers several other features that make it easy to work with variants. For example, you can use masks and components to quickly apply changes across multiple frames at once. You can also use layer groups or smart objects to group multiple layers together so they stay updated when changes are made.


Figma makes it easy to create variants of designs quickly and efficiently. All you need to do is duplicate a frame and make changes as needed, then switch between your variants using the Variants tab in Figma’s sidebar. Additional features such as masks, components, layer groups, and smart objects make it easier for designers to work with variants and keep their designs up-to-date.