skills.rest
Heartcoolman
HeartcoolmanCOMMUNITY
Explore all skills by this author →
GitHub

edit-figma-design

Convert natural-language product descriptions into Figma designs via the Figma MCP server.

88|19|Updated Apr 30, 2026
Search Tags:#design#ui#figma#wireframe#mockup
One-click install
npx skills add https://github.com/Heartcoolman/warp-cn --skill edit-figma-design-heartcoolman
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: edit-figma-design
Source: https://github.com/Heartcoolman/warp-cn/tree/main/resources/bundled/mcp_skills/figma/edit-figma-design
Command: npx skills add https://github.com/Heartcoolman/warp-cn --skill edit-figma-design-heartcoolman

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill solves the problem of manually creating or updating Figma designs, allowing users to generate mockups, wireframes, screens, components, flows, or concepts directly from written product or UI descriptions.

Core Features & Use Cases

  • Text-to-Design: Convert written descriptions into Figma mockups, wireframes, or components.
  • Iterative Feedback: Refine or extend existing Figma files based on textual feedback.
  • Design System Alignment: Align designs with existing design systems or product vocabularies.
  • Use Case: A product manager can use this Skill to create a high-fidelity design of a new feature in Figma from a detailed text description.

Quick Start

Use the edit-figma-design skill to create a high-fidelity design of a new feature in Figma from a detailed text description.

Frequently Asked Questions about edit-figma-design

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

FAQPage Schema
How do I generate Figma mockups from text descriptions?▼

To generate Figma mockups from text, you provide natural-language product or UI descriptions to the skill, which then transforms them into Figma designs, wireframes, and components.

Do I need a Figma MCP server connection to create designs from text?▼

Yes, creating designs from text requires a connection to the Figma MCP server for design system integration and direct file manipulation within your workspace.

Can I update existing Figma files using written feedback?▼

Yes, you can update existing Figma files by providing textual feedback, allowing the skill to iteratively refine or extend current screens and components.

What is the best way to align new wireframes with an existing design system?▼

The best way to align wireframes with an existing design system is using the Figma MCP server connection, which integrates your product vocabulary and components directly into the generated designs.

Can a product manager create high-fidelity UI designs without manual Figma work?▼

Yes, a product manager can create high-fidelity UI designs without manual work by using the skill to convert detailed text descriptions directly into Figma files.

Related Skills

Explore More Design & Creative Skills→
Luohao-YanLuohao-Yan
6

edit-figma-design

Convert natural language descriptions into Figma design files via MCP.

Community
Advanced
bacchus-labsbacchus-labs
4

figma-design-workflow

Generate Figma mockups from wrangler specifications with design system integration.

Official
Advanced
phoenicisfphoenicisf

figma-implement-design

Translate Figma designs into production-ready UI code.

Community
Advanced
Young-ZYoung-Z
8

x-ipe-task-based-idea-mockup

Generates UI mockups from idea summaries and saves artifacts for review.

Community
Advanced