Figma Support Forum

Replace a layer with component

We recently migrated into Figma and imported all our sketch files. I created a solid DS in Figma. Now the problem is, while working on old files, It’s hard to remove a layer and place the component at the same place.

It’s been so much annoying and it’s a life saving feature to have something like replace layer with component.

Do you also faced same problem ? Please help me out if you have a workaround or plugin that eases this.

1 Like

I made plugin Master to solve exactly this problem (and some more). There are some other plugins with similar functionality but assuming you want to replace “real” layers (not just rectangles or other placeholders), you want to save data and overrides in them, which only Master can do. Here is how to do it:

  1. Select the component or instance of the component you want to attach the layer to.
  2. Go to Master → Pick Target Component. Master remembers this component.
  3. Select layers you want to replace with the component and run Master → Link Objects to Target Component.

Here is a video showing all Master plugin capabilities in action:

This is a powerful plugin for sure. But I am currently looking for even more simple approach like the Component Replacer. It’s actually deleting and placing a new component. That works half way but I am looking for direct replacement.

Hey I just submitted a plug-in that does exactly this (if I understand your situation correctly), it takes several days to be approved but I’d love to share it with you when it is.

My plugin turns the selected layers into an instance and creates the main component at the root level of your page. It handles all kinds of tricky cases like layers spread between multiple containers, and maintaining constraints from the child to the instance.

If you’d like to beta test it I can arrange that.

2 Likes

What’s the difference between direct replacement and deleting and placing? This is the only way replacement can be done.

Yes, the only drawback of that is, it places that instance on top of all the layers. I have to manually adjust the layer position. That’s the only drawback.

1 Like

That’s great and I’d love to test it.

I am looking for something like

  1. I select a layer
  2. Open plugin and search for component from my library
  3. I click on save and that instance is replaced with the selected layer.
1 Like

Ooh ok, I think your use case is different than what my plugin provides, but I think there are a few others which attempt to do that. They should be able to insert the new instance right where the selected layer was too.

1 Like