How to swap components in XD?

[jrun]

If I create multiple components out of, let's say, icons... it would be great to be able to select that component and then right-click to quickly swap out one icon for another one. Would be great for icons, buttons, and other items that have many different variations.

Is there a way to do this and I'm just missing it?

<The Title was renamed by moderator>

[Shwetha Diwanji · Accepted solution]

Hi jrun,

Thank you for using Adobe XD. Swapping a component in XD is as simple as dragging a component from the Assets panel and placing it on top of the component on canvas you like to swap it with. Please refer to this link for more details on working with components: https://helpx.adobe.com/in/xd/help/components.html

Let us know if that helps.

[BeyondUX]

This would be a game changer jrun. The Adobe XD method to swap components is a little cumbersome. Users need to use the search every time or scroll a though a huge library to find the icon you would like to swap. The Figma/Sketch method of labeling componets takes little work up front but pays off in the long run.

[jrun]

Thanks for the reply, Shwetha!

I'm aware of the ability to drag items from the Assets panel but my panel is LONG so I'm forced to use search and even then it can be a pretty long list. Mouse, keyboard, typing, scroll through filtered list, mouse to drag-n-drop new asset in is just too cumbersome with large design systems. A simple, right-click, select "swap with..." in menu, and show a list of assets with a similar naming scheme or part of a group of components would be great.

[Shwetha Diwanji]

Hi jrun,

While we don't have such feature yet, it does seem quite interesting. Could you please file a request for same at https://adobexd.uservoice.com to get more upvotes? We will try our best to get this on our roadmap to deliver in upcoming releases. Thanks.

Go XD!!

Regards,

Shwetha Diwanji

[jrun]

Thanks, I upvoted this one and added a clarifying comment to hopefully gain support for this feature: https://adobexd.uservoice.com/forums/353007-adobe-xd-feature-requests/suggestions/38525155-swap-comp...

[will25171488kyd3]

Select a component (lets say its a "Primary" Button)
Right-click on the Primary Button and navigate to "Swap instance..." ...
A fly-out menu is shown with a list of the other related components ("Secondary", "Text-only", "Dense", for example).
Select the item to swap it with and they swap

Regards,

Will