figma-swiftui

Translate Figma designs into SwiftUI code and vice versa.

Updated Jun 12, 2026
One-click install
npx skills add https://github.com/Kushal9889/claude-plugins --skill figma-swiftui
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: figma-swiftui
Source: https://github.com/Kushal9889/claude-plugins/tree/main/figma/skills/figma-swiftui
Command: npx skills add https://github.com/Kushal9889/claude-plugins --skill figma-swiftui

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires figma, swiftui, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill facilitates the translation between Figma designs and SwiftUI code, enhancing the efficiency of iOS app development by streamlining the design to code conversion process.

Core Features & Use Cases

  • SwiftUI Code Generation: Convert Figma designs into SwiftUI code, enabling the creation of UI components and screens.
  • Design-to-Code: Translate Figma designs into SwiftUI code with support for both code-to-design and design-to-code paths.
  • Use Case: When a designer provides a Figma design for a new feature, this Skill can translate it into the corresponding SwiftUI code, allowing developers to implement the feature more quickly.

Quick Start

Run the 'figma-swiftui' skill with the Figma file URL and specify the direction of translation: run figma-swiftui --url "https://www.figma.com/file/0123456789ABCDEF?node-id=12345" --direction design-to-code.

Frequently Asked Questions about figma-swiftui

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I convert Figma designs to SwiftUI code?

To convert Figma designs to SwiftUI code, provide the Figma file URL and set the translation direction to design-to-code. The Skill interprets the design via the Figma API and generates corresponding SwiftUI components for your iOS app.

Can I translate SwiftUI code back into Figma designs?

Yes, you can translate SwiftUI code back into Figma designs by setting the direction parameter to code-to-design. This supports workflows where developers need to sync implemented UI changes back to the original Figma file.

Do I need a Figma API token to generate SwiftUI views from my design file?

Yes, a Figma API connection is required to interpret the design file and translate it into SwiftUI code. The Skill relies on this dependency to parse design nodes and generate accurate SwiftUI framework components.

What is the best way to automate iOS UI prototyping from Figma?

Automating iOS UI prototyping from Figma is best handled by translating design nodes directly into SwiftUI code. This approach streamlines feature implementation by generating ready-to-use UI components from the provided Figma file URL.

Does the Figma to SwiftUI translation support entire iOS app screens?

Yes, the Figma to SwiftUI translation supports generating both individual UI components and full iOS app screens. By specifying the target node ID in your Figma URL, the Skill accurately interprets and converts the selected design scope into SwiftUI code.