home/categories/cms-platforms/tech-leads-club-agent-skills-packages-skills-catalog-skills-design-figma-implement-design-skill-md
cms-platformsdevelopment

figma-implement-design

Translate Figma nodes into production-ready code with 1:1 visual fidelity using the Figma MCP workflow (design context, screenshots, assets, and project-convention translation). Use when the user provides Figma URLs or node IDs and asks to implement designs or components that must match Figma specs. Requires a working Figma MCP server connection. Do NOT use for general Figma data fetching, variable exploration, or MCP troubleshooting (use figma instead).

tech-leads-club
maintainer
tech-leads-club
اپ ڈیٹ ہوا 2/26/2026
اسٹارز
2054
فورکس
236
quick start

Installation and usage

Translate Figma nodes into production-ready code with 1:1 visual fidelity using the Figma MCP workflow (design context, screenshots, assets, and project-convention translation). Use when the user provides Figma URLs or node IDs and asks to implement designs or components that must match Figma specs. Requires a working Figma MCP server connection. Do NOT use for general Figma data fetching, variable exploration, or MCP troubleshooting (use figma instead).

انسٹالیشن
$ install --globalskills.sh
استعمال

انسٹال کرنے کے بعد، آپ یہ اسکل ٹرمینل میں درج ذیل کمانڈ چلا کر استعمال کر سکتے ہیں:

skills use figma-implement-design