Figma UI kit
How to use Slots
Slots are special placeholders that let you insert your own custom content — like an image, or even a data table — right into a component without having to detach it. It’s how you can customize things without breaking stuff.
Step 1
Make your desired content a component
The content you want to place in a slot must be a component itself.
In your design file:
Design your custom content.
Make it a local component.
To keep your file tidy, place the new component on the same page as the slot you'll use it in.
Step 2
Select the slot property and swap instance
Click on the main component.
In the design panel on the right, click on the property named Slot (Swap me).
Search and select your local component to swap in your custom content.
