Figma to Swiftui
Implement or update iOS SwiftUI UI from Figma designs; also use for implementation plans, token mapping, or asset export for that UI.
Install
npx skills add daetojemax/figma-to-swiftui-skill --skill figma-to-swiftuigit clone --depth 1 https://github.com/daetojemax/figma-to-swiftui-skill.git /tmp/figma-to-swiftui-skill
mkdir -p ~/.claude/skills
cp -r /tmp/figma-to-swiftui-skill/. ~/.claude/skills/figma-to-swiftuiPersonal skills live in ~/.claude/skills. Use .claude/skills in a project folder to share a skill with your team.
From the SKILL.md
# Figma to SwiftUI Deliver native SwiftUI that matches the requested Figma design and fits the existing app. Treat generated web code as design evidence, not as code to port. Preserve the project's architecture, component APIs, and behavior outside the requested change. ## Choose the scope Use the user's request and any brief to establish the target screens, actions, states, and supported devices. A brief defines behavior and scope; Figma defines visuals within that scope. Read [source-document.md](references/source-document.md) when a brief needs reconciliation with the design. - **Implement a screen or component:** gather the relevant design evidence and project context, then implement through completion. - **Update existing UI:** inspect the affected view and dependencies; use [adaptation-workflow.md](references/adaptation-workflow.md) to preserve behavior while closing the visual differences. - **Plan, map tokens, or export assets:** deliver that artifact without automatically implementing screens or changing shared design systems. Resolve routine choices from the codebase and design. Ask when an unresolved choice materially changes scope, behavior, or the target design; continue independent work while it is clarified. A plan or difference checklist is working context, not a mandatory approval gate. ## Gather the evidence needed Use available Figma tools according to their current schemas. Do not assume every server exposes the same tools or parameters.
Details
- Skill name
figma-to-swiftui- Repository
- daetojemax/figma-to-swiftui-skill
- Repo updated
- 18 September 2026
FAQ
What does the Figma to Swiftui skill do?
Implement or update iOS SwiftUI UI from Figma designs; also use for implementation plans, token mapping, or asset export for that UI.
How do I install the Figma to Swiftui skill?
skills CLI (Claude Code, Cursor, Codex and more): npx skills add daetojemax/figma-to-swiftui-skill --skill figma-to-swiftui. Skills go in ~/.claude/skills (personal) or .claude/skills (project), and Claude loads them automatically when a task matches the description.
Is Figma to Swiftui popular?
It lives in daetojemax/figma-to-swiftui-skill, which has 27 GitHub stars and 3 forks.
Related skills
Stark
33f0d010c/stark
Use for UI/UX design, product flows, frontend or native interface design, design audits, design translation, asset planning, motion direction, design tokens, or distinctive non-generic apps and websites. Covers web and React, Windows and WinUI/Mica, Apple and SwiftUI, Android and Jetpack Compose/Material, cross-platform UI, and token export. Route to the focused skill, then load only the references required for the selected surface and failure mode.
SVG Character Animator
31molauu/svg-character-animator
Generate production-quality SVG character animations — state machines that morph between N SVG states (2–10) with per-state idle motion (breathing, blinking, swaying). Use whenever the user wants to animate a character or mascot between poses/emotions, morph icons/illustrations between forms, build interactive SVG state machines, or add ambient idle motion to vector graphics. Triggers include character/mascot animation, SVG path interpolation, character emotion transitions, icon toggles with animation, multi-state vector animations, or "make this SVG come alive." Also use when the user referen
Dejank
31gbasin/dejank
Detect and diagnose visual jank in React UIs. Covers two modes -- static analysis of code patterns that cause flicker, layout shift, and flash of intermediate state (for pre-merge review or preventive sweeps), and runtime investigation of specific visual symptoms (flicker, blink, jump, stutter, remount churn, scroll reset, post-paint correction). Use when the user mentions jank, something feeling off, flashing, blinking, layout shifting, full repaints, or wants a render stability audit.
Impeccable Lite
27ilindaniel/impeccable-lite
Design, build, redesign, critique, audit, and refine frontend interfaces with strong visual direction and production-ready UX. Use for websites, landing pages, dashboards, application UI, components, forms, onboarding, empty states, responsive behavior, accessibility, typography, color, layout, motion, UX copy, or when an interface feels generic, bland, cluttered, inconsistent, or unfinished. Do not use for backend-only or non-UI tasks.
Scroll Painting Animation
24xiwan/scroll-painting-animation
把一幅长卷名画(或任何"沿一条路看过去"的全景题材)做成横向卷轴、等距游戏画风的动画短片:读原作排时间轴与功能团、 用 ComfyUI 统一风格地生产建筑/人物/船/贴图精灵、用 Python(numpy + Pillow)搭等距场景并逐帧渲染、 做疏密与聚团布局、行人车马船的运动、昼夜晨昏与万家灯火、题诗逐字晕墨显现、用 MMAudio 按画面生成环境声与场景音效, 最后用统计、抽帧、跳帧检查、响度测量验收。附可复用库 scrollkit、可运行骨架 scroll_demo 和一套工具脚本。 来源项目:《清明上河图》180 秒 1080p 等距动画(《烽火与炊烟》画风)。 触发词:清明上河图动画、名画动起来、长卷动画、卷轴动画、千里江山图、姑苏繁华图、等距卷轴、isometric scroll、 panoramic pan animation、2.5D 全景动画、横向平移长卷、ComfyUI 精灵、批量生成建筑素材、功能团布局、 万家灯火夜景、题诗渐显、MMAudio 音效、按画面配音效。
Copy Thief
27thalesholleben/copy-thief
Escreve e revisa copy persuasiva de alta conversão para páginas de vendas (landing pages), advertoriais/pre-sell e VSLs, com foco em tráfego frio vindo de Ads (Meta e Google) para produtos e serviços digitais. Use quando o pedido envolver: escrever ou revisar uma página de vendas, landing page, sales letter, carta de vendas, copy de oferta, VSL, advertorial, pré-venda, headline, CTA, ou "vender no tráfego frio". O workflow é sempre diagnóstico → estrutura aprovada pelo usuário → copy. Idioma de saída padrão: PT-BR (mercado brasileiro).
Browse the most popular Claude skills, all frontend & design skills, or write your own with the skills generator.