Install ↓ Buy $ Docs ?

Create a component from similar objects

Using Master plugin, you can convert similar objects into a new component in a couple of clicks. The objects you select will be turned into instances of a single new component with all the applicable overrides.

How to create a new component

  1. Select objects you want to create a component from. If you need overrides to be preserved correctly, these objects must have the same layer order & hierarchy.
  2. Open the Plugins Menu by pressing Cmd + K and switching to the Plugins tab
  3. In the plugins menu, find Master and run Create Component from Objects.

A new component will be placed nearby and all selected objects will be turned into its instances, keeping overrides where possible.

In case you don’t achieve the desired result first try, simply press ⌘Z or Ctrl+Z to undo the action, make sure the layers have the matching hierarchy and try again.

The types of objects you can create a new component from are Frames, Groups and Instances of existing components. You can also convert multiple primitive objects of the same type: vectors, primitive shapes, text layers, etc.

Example: convert frames to a component

Let’s see Master plugin in action and turn list of similar frames into instances of a new component. I used regular frames to quickly iterate on the design but now I want to finalize the design and create a component. After selecting the frames and running the Master plugin, they all became instances of a new component placed above.

Notice how they are filled with content and contain different icons, Master plugin was able to preserve text overrides, visibility of the play icon and swapped the cloud icons correctly (they are instances). The word “frame” was also replaced with “component” in the name for convenience.

Quickly select similar objects

Here’s a tip: to quickly select objects you want to turn into component instances with Master, use the multi-edit feature “Select matching layers” shortcut ⌥⌘A or Ctrl+Alt+A.

If there are more objects than Figma can find, you can also use “Select all with…” commands in the Edit menu or use plugins like Similayer or Select Similar to speed up this process.

TL;DR

Select items with the same structure and run Master → Create Component from Objects

See also

Learn how to attach instances to an existing component.

Use component creation feature to clone a component.

Learn through practice via the interactive guide.



Install ↓ Buy $ Docs ?