Skip to main content

Add a "slot" functionality to components


Show first post

36 replies

mugtaba.g
  • New Participant
  • 6 replies
  • October 6, 2024

Something like this fits perfectly inline with the simplicity and speed that Figma currently offers with respect to UI design or making libraries, it’s a small change (in terms of UX) that adds a huge upgrade. It removes redundancy from designing layout components like collapsible sections and modals - I end up moving to Framer just for things like that. There are very few things that Figma feels lacking in and this is one of them.

It’s confusing to figure out the priorities of an app like Figma which assumes to be community-driven but feels random in what they change.


Jussi1
  • New Member
  • 1 reply
  • October 16, 2024

One more vote from me! Currently, I’ve created components in this way:

If I want to keep the Dialog component as a component, I need to pass a component to the “Replace with your content” area, making composition slow. And so I typically detach the component. I would love to pass whatever content to the content area (slot) and keep the component intact.

Now, if I ever wanted to change, say, the content area padding, I’d need to make that change everywhere in Figma (instead of on the component level). The header and footer I can keep as components, as seen in the screenshot, which is great.

I assume this might be technically difficult on Figma’s side, as otherwise, it seems like low-hanging fruit to implement and get closer to how frontend developers work.

Let’s wait and hope for the best 🤞t2:


Sam_Baldwin1
  • New Member
  • 3 replies
  • November 19, 2024

+1, we really need this


Jelle_de_Graaf

We need this as well. We are considering to move forms into card containers but managing this to a design team that’s relatively new to a design system isn’t easy to govern. I’m sure the team at Figma has this on their radar. +1 for pushing this idea


Samuel_Cole

I am desperate for this. Please implement!!


Pavel_Kiselev
  • Power Member
  • 438 replies
  • December 6, 2024

I have something for you to take a look at → Slot component workflow plugin

This is not a solution you were looking for, but a handy tool to speed up the process and avoid breaking down your instances


morgan544545
  • New Member
  • 2 replies
  • December 9, 2024

I believe that your idea about the introduction of the “slot” plugins that are respectively attached to the Components of Figma is in no such form bad in itself and I also feel it is a great way to achieve backward compatibility through standard APIs without any regressions. These features unequivocally would make the components more flexible and allow us to build richer or more reusable designs. Change the color of the slot background in a slot-based component to light blue.


Marco WebDev
ryanleichty wrote:

This is what I want: a blue frame inside of a purple frame.

 

 

I don’t want to make everything a component in order to insert it inside of another component via instance swapping.

This was kind of possible a few years ago, idk why they would remove such a functionallity, which is pretty basic to most of our needs. Please (re)implement ASAP :) 


Corey_O_Brien

Still nothing… So sad that this wasn’t a part of new features at Config 2025.  Without slot components, it is very hard to create large designs with many pages.  For instance, I have a modal and I want it to be essentially the same layout but I want the interior contents to be different.  I don’t have a lot of options today to make a common layout but put content into that layout.  I can use swap components now, but that still means I need to maintain a bunch of components separate from my modal component and then swap them in when needed in a particular screen.  Why can’t it be like code where I can make my screen but put my content inside of a slot, inside of the parent?  In this way, I can create my modal with my content but inherit the frame and structure from the main component.  Maintaining a hundred components to swap in and out of another component is a nightmare.


Michele Kolodi

A typical workaround is to create a component out of your custom content and use it to swap nested instance. You probably need to hide it or place around the “page” you are working on, then you modify those INSTEAD actual content on the page. This feels and it IS a very stupid workaround. I started to use Figma time ago and I immediately noticed lack of this basic possibility, I can’t believe this issue has not been solved yet.


Dave40
  • New Member
  • 3 replies
  • May 23, 2025

Desperately need this for way too long.. +1


Reply


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings