figma-integration
From the author
Keep Figma and code in sync — map the 3-tier DTCG tokens to Figma Variables (collections + modes), sync in either direction, use the Figma MCP when connected, and verify component parity (variants/states). Use when the user wants to push tokens/components to Figma, pull a design into code, set up token↔Variable sync, or check design-code drift.
Install
npx skills add plugin87/ux-ui-agent-skills --skill figma-integration -a claude-code
Installs to .claude/skills/figma-integration/ · Each command fetches the skill straight from GitHub with the open skills CLI.
Byte-identical to the scanned commit, with the repository’s licence and a SOURCE.txt.
Want your agent to suggest skills while you type? See how to use skills from your IDE.
Safety checks on SKILL.md
No warnings.
Why 89
aiqbench computes the trust score from public signals. It is not a security audit, so read a skill before you install it.
Similar skills
Closest to this one by what they do and when they are used.
- figma-implement-designnexu-io/open-designTranslate Figma designs into production-ready code with 1:1 visual fidelity. Useful for handing off Figma frames straight to a frontend agent.Design★ 102.9K
- figma-code-connect-componentsnexu-io/open-designConnect Figma design components to code components using Code Connect so design-system updates flow into the codebase automatically.Design★ 102.9K
- design-tokensplugin87/ux-ui-agent-skillsGenerate, extend, or audit design tokens in DTCG format with the 3-tier architecture (primitive → semantic → component). Use when the user wants a color palette, type scale, spacing/shadow/radius/motion tokens, multi-brand theming, or wants to validate token files. Covers colors, typography, spacing, shadows, borders, breakpoints, motion, gradients, opacity, blur, sizing, states, theming.Design★ 2.6K
- figma-automationdavepoon/buildwithclaudeAutomate Figma tasks via Rube MCP (Composio): files, components, design tokens, comments, exports. Always search tools first for current schemas.Design★ 3.7K
- figma-generate-designnexu-io/open-designBuild or update screens in Figma from code or description using design system components. Translate app pages into Figma using design tokens.Design★ 102.9K
- figma-usenexu-io/open-designRun Figma Plugin API scripts for canvas writes, inspections, variables, and design-system work. Prerequisite for every other Figma skill in this catalogue.Design★ 102.9K
Ratings & reviews
—
no reviews
Tried this skill? Rate it to help others. Sign in
Discussion
Join the discussion. Sign in