# Figma

> Design and development workflows

Skills for Figma design generation, diagrams, code connections, specifications, and implementation workflows.

## Profile stats

- Skills: 15
- Stars: 31k
- Best skill: figma-code-workflows

## Links

- HTML page: https://omgskills.com/library/figma/
- GitHub: https://github.com/figma

## Featured skills

- [figma-code-workflows](https://omgskills.com/skills/figma/mcp-server-guide/skills/figma-code-workflows/index.md) — Import or upload local HTML or project files into Figma, choose editable Design frames, runnable Code Layers or...
   - [@figma](https://omgskills.com/library/figma/index.md) · 2.1k stars
- [figma-generative-plugins](https://omgskills.com/skills/figma/mcp-server-guide/skills/figma-generative-plugins/index.md) — \*\*MANDATORY prerequisite\*\* — load this skill before calling \`create\_generative\_plugin\` or \`update\_generative\_plugin\`.
   - [@figma](https://omgskills.com/library/figma/index.md) · 2.1k stars
- [figma-shaders](https://omgskills.com/skills/figma/mcp-server-guide/skills/figma-shaders/index.md) — \*\*MANDATORY prerequisite\*\* — load this skill before calling \`create\_shader\` or \`update\_shader\`.
   - [@figma](https://omgskills.com/library/figma/index.md) · 2.1k stars
- [figma-spec](https://omgskills.com/skills/figma/mcp-server-guide/skills/figma-spec/index.md) — This skill is required to create, read, edit, review, or comment on Figma specs.
   - [@figma](https://omgskills.com/library/figma/index.md) · 2.1k stars
- [figma-code-connect](https://omgskills.com/skills/figma/dev-mode-mcp-server-guide/figma-code-connect/index.md) — Creates and maintains Figma Code Connect template files that map Figma components to code snippets.
   - [@figma](https://omgskills.com/library/figma/index.md) · 2.1k stars
- [figma-create-new-file](https://omgskills.com/skills/figma/dev-mode-mcp-server-guide/figma-create-new-file/index.md) — Always use this skill when the user wants to create a new Figma Design, FigJam, or Slides file.
   - [@figma](https://omgskills.com/library/figma/index.md) · 2.1k stars
- [figma-design-to-code](https://omgskills.com/skills/figma/dev-mode-mcp-server-guide/figma-implement-design/index.md) — \*\*MANDATORY prerequisite\*\* — you MUST invoke this skill BEFORE calling the \`get\_design\_context\` Figma MCP tool.
   - [@figma](https://omgskills.com/library/figma/index.md) · 2.1k stars
- [figma-generate-design](https://omgskills.com/skills/figma/dev-mode-mcp-server-guide/figma-generate-design/index.md) — Use this skill alongside figma-use when the task involves translating an application page, view, or multi-section...
   - [@figma](https://omgskills.com/library/figma/index.md) · 2.1k stars
- [figma-generate-diagram](https://omgskills.com/skills/figma/dev-mode-mcp-server-guide/figma-generate-diagram/index.md) — MANDATORY prerequisite — load this skill BEFORE every \`generate\_diagram\` tool call.
   - [@figma](https://omgskills.com/library/figma/index.md) · 2.1k stars
- [figma-generate-library](https://omgskills.com/skills/figma/dev-mode-mcp-server-guide/figma-generate-library/index.md) — Used to build or update a professional-grade design system in Figma from a codebase.
   - [@figma](https://omgskills.com/library/figma/index.md) · 2.1k stars
- [figma-use](https://omgskills.com/skills/figma/dev-mode-mcp-server-guide/figma-use/index.md) — \*\*MANDATORY prerequisite\*\* — you MUST invoke this skill BEFORE every \`use\_figma\` tool call.
   - [@figma](https://omgskills.com/library/figma/index.md) · 2.1k stars
- [figma-use-figjam](https://omgskills.com/skills/figma/dev-mode-mcp-server-guide/figma-use-figjam/index.md) — This skill helps agents use Figma's use\_figma MCP tool in the FigJam context.
   - [@figma](https://omgskills.com/library/figma/index.md) · 2.1k stars

## Others you might like

- [Firebase](https://omgskills.com/library/firebase/index.md)
- [Firecrawl](https://omgskills.com/library/firecrawl/index.md)
- [Firetiger](https://omgskills.com/library/firetiger-oss/index.md)