Search: "figma"
Showing 19 of 19 results
figma
Import Figma content into a HyperFrames composition — rendered assets, brand tokens, components, storyboard sections → reconstructed motion (frames read as states, not slides) (REST/CLI), connector-assisted motion when available, and shaders from a connector or native export. Use when the user pastes a figma.com link or asks to bring a Figma design, frame, logo, brand, or animation into a video/composition.
Figma
Figma 集成。浏览团队项目与文件，读取设计结构、页面、节点，导出图片，管理评论，查看版本历史，检查组件/组件集/样式，获取设计变量（Token）。通过 MorphixAI 代理安全访问 Figma API。
Figma
Figma (figma.com). Use this skill for ANY Figma request — reading, creating, updating, and deleting data. Whenever a task involves Figma, use this skill inst...
Figma
Read files, manage comments, extract design tokens, download images, and create webhooks in Figma via the Figma REST API. Use this skill when users want to i...
Figma
Interact with Figma files to read structure, export layers as images, and retrieve comments using the Figma REST API with authentication.
Figma设计集成-免费版
Figma设计集成工具免费版，面向个人设计师的Figma工作区访问工具。核心能力：，可自动提升工作效率 - 浏览Figma团队项目与文件列表 - 读取设计文件结构与指定节点详情 - 导出设计图片（PNG/JPG/SVG/PDF） - 查看文件评论与版本历史 适用场景： - 个人设计师查看设计文件 - 开发者获取设计资产与图标 - 设计走查与评论查看 差异化：免费版聚焦文件浏览、节点读取与图片导出，适合个人使用'
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-conv...
Figma Design Integration
Figma design asset reading, code generation, and MCP integration. Covers REST API direct calls and MCP Server capabilities for design-to-code workflows. **Us...
Figma Sync
Read Figma files, extract design tokens, generate React Native Expo TS or Web React + Tailwind code, write back to Figma, and diff local models against Figma for minimal patches. Triggers: "pull figma", "sync figma", "figma to code", "push to figma", "diff figma", "extract design tokens", "generate from figma", "preview figma changes"
figma-generate-diagram
# generate-diagram **You MUST load this skill before every `generate_diagram` tool call.** Skipping it causes preventable rendering failures and low-quality output. `generate_diagram` takes Mermaid.js syntax and produces an editable FigJam diagram. This skill routes you to the right per-type guidance and sets universal constraints. ## Step 1: Is `generate_diagram` the right tool? ### Supported diagram types `flowchart`, `sequenceDiagram`, `stateDiagram` / `stateDiagram-v2`, `gantt`, `erDiagram`. ### Unsuppo
figma-use
# figma-use > Curated from Figma's MCP server guide. ## What it does Run Figma Plugin API scripts for canvas writes, inspections, variables, and design-system work. Prerequisite for every other Figma skill in this catalogue. ## Source - Upstream: https://github.com/figma/skills - Category: `figma` ## How to use This catalogue entry advertises the skill in OpenDesign so the agent discovers it during planning. To run the full upstream workflow with its original assets, scripts, and references, install the ups
figma-create-design-system-rules
# figma-create-design-system-rules > Curated from Figma's MCP server guide. ## What it does Generate project-specific design system rules for Figma-to-code workflows. Useful for capturing tokens, naming, and lint rules in one source. ## Source - Upstream: https://github.com/figma/skills - Category: `figma` ## How to use This catalogue entry advertises the skill in OpenDesign so the agent discovers it during planning. To run the full upstream workflow with its original assets, scripts, and references, instal
figma-generate-design
# figma-generate-design > Curated from Figma's MCP server guide. ## What it does Build or update screens in Figma from code or description using design system components. Translate app pages into Figma using design tokens. ## Source - Upstream: https://github.com/figma/skills - Category: `figma` ## How to use This catalogue entry advertises the skill in OpenDesign so the agent discovers it during planning. To run the full upstream workflow with its original assets, scripts, and references, install the upstr
figma-code-connect
# Code Connect ## Overview Create Code Connect template files (`.figma.ts`) that map Figma components to code snippets. Given a Figma URL, follow the steps below to create a template. > **You write `.figma.ts` template files ONLY — never `.figma.tsx`.** This skill produces *parserless templates*: a `.figma.ts` file whose default export uses a `` figma.code`...` `` tagged template. Do **NOT** write a `.figma.tsx` file and do **NOT** use `figma.connect()` — that is the separate **parser-based** Code Connect f
figma-create-new-file
# create_new_file — Create a New Figma File **MANDATORY: load this skill before every `create_new_file` tool call.** It encodes the plan-resolution decision tree, the editor-type contract, and the post-creation handoff to `use_figma`. Use the `create_new_file` MCP tool to create a new blank Figma file in the user's drafts folder. This is typically used before `use_figma` when you need a fresh file to work with. ## Skill Arguments This skill accepts optional arguments: `/figma-create-new-file [editorType] [f