Skip to main content
Akbar_Hossain1
New Member
Nov 6, 2026 8:39 PM UTC
Question

Slots: content inside native slots doesn't render in the editor (missing borders 2 levels deep; missing child elements of an instance 1 level deep)

**Summary**
Content placed into a component's native slot (SLOT property) partly doesn't render in the editor canvas, although the layers exist, are visible, at 100 % opacity and inside the slot bounds. The same frame renders correctly when exported, and an isolated copy of the same content (outside the slot) renders correctly too.

**Environment**
- Figma [desktop app / browser + version], [OS + version]
- Seen on [date], reproducible after reload

**Setup**
- Component "Main body" with two native slots: "Side panel" (320 px) and "Canvas" (1,120 px), vertical auto layout, clip content off on both slots.
- Main body is used (a) inside another component instance ("Master page" = header + side nav + Main body) – two instance levels – and (b) directly on a frame – one instance level.
- Slot content: frames with auto layout containing library instances (inputs with 1 px inside borders, buttons, icons). All widths are whole pixels.

**Steps to reproduce**
1. Create a component with a native slot, e.g. 1,120 px wide, vertical auto layout, clip content off.
2. Put an instance of it inside another component and place that on a frame (two instance levels).
3. Move existing content into the slot: a form with text inputs (1 px inside stroke, e.g. 341–389 px wide) and a toolbar instance whose children use Fill/Hug (left: title; right: icon buttons, a separator and a nested instance).
4. Look at the canvas, then export the frame or view it in another tool.

**Expected**
The editor shows the slot content exactly as the export does.

**Actual**
1. Two instance levels deep: input borders lose their top and right strokes on several fields.
2. Already one instance level deep: the toolbar instance inside the slot doesn't render its right-hand controls (two icon buttons, a separator and a nested instance). In the layers panel they're present, visible, at 100 % opacity and inside the slot bounds.
3. The export shows everything correctly; an isolated copy of the same content outside the slot also renders correctly.

**What we ruled out**
- Clipping: clip content is off on the slots; content is inside the bounds.
- Sub-pixel sizes: all widths are whole pixels (we first suspected 168.5 px fields and fixed them).
- Width overflow: the toolbar is set to Fill and narrower than the slot.
- One instance level instead of two fixes the borders, but not the missing toolbar controls.

**Impact**
We're moving a design system from instance-swap placeholders to native slots. Screens built with slots can't be reviewed in the editor, so we're keeping plain frames for now.

**Attachments**
- Screenshot / recording: editor canvas vs. export of the same frame
- Minimal repro file: [link to a small file with dummy content]