My suggestion for Figma is to add a “slot” functionality to components.
This would allow designers to create more flexible and customizable components, by adding empty slots or placeholders within a component. Users could then insert their own content or elements into these slots, without having to ungroup or modify the component itself.
This functionality would save time and increase efficiency for designers, while also promoting a more consistent design system across a project or organization.
I believe this feature would greatly enhance the flexibility and usability of Figma’s component system, and would be a valuable addition to the platform.
Love the idea, I have been trying to override nested instances inside of parent instances without success! But along that vein: how would these slots affect nested instances? Would it expand the nested instances feature with for example a toggle to “open up” the instance swap feature for overrides? It could be pretty elegant; toggle overrides on/off, and default to one of the preferred values for the instance swap
Great idea! We can add a special attribute called “slot” to the component to enable the functionality of inserting other content or components into the component.
This will make the component more flexible and reusable, while also improving the efficiency and consistency of the design system.
This approach is similar to the slot and component-based development patterns in modern web development.
I’m begging for this functionality. It’s such a basic and common design/development pattern and functionality, and yet, it’s missing.
In terms of how it would look and be used in Figma’s interface, it can simply be an addition to the already present “Boolean”, “Instance Swap” and “Text”. Just add a “Slot” option, and you simply select an element within a component, and make it a “Slot”. Or go to component’s properties and create new “Slot” and then assign an element to it.
There is a ton of use cases for slots. Basically, every container should be a slot. Every modal or a dialog box we design, should just be that: modal or a dialog box, and they should be free of content in terms of logic. You add content to it, because they shouldn’t be concerned with content, just the layout structure and design.
I think this feature can’t come soon enough, and I think there isn’t a single designer who wouldn’t be overjoyed with having this feature available, seeing there are already numerous videos and tutorials explaining how to do something similar, but in an extremely “hacky” way.
I was just thinking about this “extensible” possibility, too. Like being able to truly create modular components in atomic design systems. Like a segmented control component which accommodates N amount of segments:
Would love to see this as well. Our team has worked around this using instance swap and a ‘default content instance’ that’s an example, but the big limitation we run up against is that original example instance always dictates the size of what you swap it out with. For example if it’s a 200 x 200 container and I need to put something 300 x 300 in there, I always have to do some tweaking and experimenting to get where I need to be with the Hug and Fill and the size of the main component. If I had multiple slots that could be swapped, even worse / impossible.
I came here to look for this exact request. I am so tired of having ten hidden items in components. My other workaround is to have dozens of properties, one for each slot. I agree that there is probably not a single designer who wouldn’t benefit from this. It’s my #1 request by far.
You need to have a bunch of slots in the main component to accommodate the designs with the highest requirements, which pollutes the layers panel for designs with fewer slots needed.
Items cannot be rearranged easily.
Slots should be just an arbitrary number of repeated components within a container component. The order and quantity of these slots should be freely managed.
My suggestion for Figma is to add a “slot” functionality to components.
This would allow designers to create more flexible and customizable components, by adding empty slots or placeholders within a component. Users could then insert their own content or elements into these slots, without having to ungroup or modify the component itself.
This functionality would save time and increase efficiency for designers, while also promoting a more consistent design system across a project or organization.
I believe this feature would greatly enhance the flexibility and usability of Figma’s component system, and would be a valuable addition to the platform.
Hey @Equinusocio, Thanks for bringing this back to our attention!
We like to use votes as a way to measure interest and prioritize features, so we’re eager to see what the rest of the community thinks.
We think this idea could really benefit others in our community. If you’re on board with this idea, don’t forget to give it a thumbs up!
This feature almost exits in that you can replace inner component instance with another. There’s a few problems with it.
It doesn’t work the way you would expect it to work with variants.
The replacements are a pain to do from the combo-box. There should be some way to drag-and-drop replacement component instance into the “slot”.
The “slot” content needs to be it’s own component which gets annoying. An analogous problem in programming has been solved with lambda functions. Maybe that could serve as an inspiration for a one-off anonymous component in a “slot”.
Hi, we already voted on the closed topic linked above. If the platform keeps closing the topics without comment we can’t vote anymore and we lose previous votes, forcing us to open a new one from scratch.
A smart solution to this could be the one adopted by Framer. A container/slot to which you can link another frame that should be rendered inside.
