DSI: Slot

DSI: Slot is a Figma plugin for building, converting, and auditing slot-ready components using Figma's native Slot feature.

Compose lets you paint slot regions on a 12-column grid and nest regions inside regions. Every painted region, parent and child alike, becomes its own native SlotNode with its own SLOT property on the generated component. Each slot gets a name, a role (header, nav, hero, media, sidebar, content, body, actions, footer, or custom), and a distinct role color.

Convert takes any existing frame or component and wraps its children as real SlotNodes using a semantic inference engine that reads layer names, positions, and sizes. A hidden backup of the original is preserved so Undo restores it in one click.

Suggest scores components 0 to 100 on slot readiness based on hidden-layer workarounds, boolean prop overuse, and instance-swap patterns, then recommends slot names and roles.

Templates ships six production layouts (Card, Hero, Dashboard, Modal, Feed, Auth) that insert as live Figma components with SlotNode properties already configured.

After Compose or Convert finishes, a Preview with Content step appears inline and ranks your page's other components by role fit so you can fill each new slot in one click. Inserts come with Fill-fix applied, solving Figma's slot fill-sizing bug.

Key capabilities• Visual grid-to-slot workflow with nested regions• Six production templates with native SlotNode properties• Semantic inference converts existing frames to slots• Slot readiness scoring with named role suggestions• Inline Fill Slots step with role-fit ranking and Fill-fix• Sixteen device viewport presets plus custom width• Six UI locales (English, Japanese, Korean, Portuguese BR, Spanish ES, Spanish LatAm)• Local-only. No network access. No credentials stored.

Built for design system teams who need structure, not shortcuts.