Figma Component Sync Skill

Specialized workflow for translating a Figma node URL into production-ready components and Storybook stories with high visual fidelity.

When to Use

• User shares a Figma URL and asks to implement the UI
• User asks for "Figma to Storybook" or "sync design to code"
• User needs exact visual parity before productization

Required Inputs

• Figma URL with node-id parameter
• Initiative name (or feature name) for artifacts
• Target domain in app (for example chat, navigation, settings)

Codebase Targets

Use the current Elephant AI app layout: