skills.rest
pathtoresiliencebv
pathtoresiliencebvCOMMUNITY
Explore all skills by this author →
GitHub

edit-figma-design

Convert text descriptions into Figma design files via a connected MCP server.

Updated Jun 20, 2026
Search Tags:#ui/ux#figma#interface design#design automation#text-to-design
One-click install
npx skills add https://github.com/pathtoresiliencebv/warp-customized --skill edit-figma-design-pathtoresiliencebv
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: edit-figma-design
Source: https://github.com/pathtoresiliencebv/warp-customized/tree/main/resources/bundled/mcp_skills/figma/edit-figma-design
Command: npx skills add https://github.com/pathtoresiliencebv/warp-customized --skill edit-figma-design-pathtoresiliencebv

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

Transform written descriptions into precise Figma designs quickly and efficiently, eliminating the need for manual design work.

Core Features & Use Cases

  • Text-to-Design: Convert textual descriptions into Figma screens, components, flows, and mockups.
  • Iterative Feedback: Refine existing Figma files based on textual feedback.
  • Design System Alignment: Ensure designs align with existing design systems or product vocabularies.
  • Use Case: Design a new onboarding flow for a mobile app, starting with a simple text description.

Quick Start

"Create a high-fidelity mockup of our app's login screen based on the following design requirements: [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 convert text descriptions into Figma designs?▼

To convert text descriptions into Figma designs, you can use this Skill to transform natural language inputs into Figma screens, components, and mockups. It requires a connected Figma MCP server to facilitate creating and modifying interfaces directly from written requirements.

Can I iterate on existing Figma interfaces using text feedback?▼

Yes, you can refine existing Figma interfaces using text feedback. The Skill processes written feedback to modify and iterate on current Figma files, allowing seamless updates to design workflows without manual adjustments.

Do I need a Figma MCP server to generate interface designs from text?▼

Yes, a connected Figma MCP server is required to generate interface designs from text. This connection allows the Skill to interact with Figma workspaces, facilitating the creation and modification of design files from natural language descriptions.

How do I ensure generated Figma mockups align with my design system?▼

To ensure generated Figma mockups align with your design system, the Skill incorporates design-system elements and product vocabularies. It uses these references during text-to-design conversion to maintain consistency with established UI components.

What is the best way to create a mobile app onboarding flow in Figma from text?▼

The best way to create a mobile app onboarding flow in Figma from text is by providing a detailed natural language description of design requirements. The Skill translates this text directly into high-fidelity Figma mockups and screens.

Related Skills

Explore More Design & Creative Skills→
openaiopenai
24.7k

figma-code-connect-components

Map Figma components to code components via Code Connect mappings.

Official
Intermediate
phoenicisfphoenicisf

figma-implement-design

Translate Figma designs into production-ready UI code.

Community
Advanced
1479089714790897
7

kwp-design-design-system

Audit component libraries for naming inconsistencies and missing documentation.

Community
Intermediate
MesteriisMesteriis

figma-to-code

Convert Figma design elements into code while preserving assets and fidelity.

Community
Advanced