---
title: "figma-ui"
description: "Create, edit, inspect, and maintain Figma designs through figma-ui-mcp with strong auto-layout, component, and design-system conventions."
canonical: https://agentpluginsdirectory.com/plugins/figma-ui
last-updated: 2026-09-23
---

# figma-ui
Create, edit, inspect, and maintain Figma designs through figma-ui-mcp with strong auto-layout, component, and design-system conventions.
- Slug: figma-ui
- Publisher: JALA
- Repository: https://github.com/Atnic/jala-agent-plugins
- Manifest: figma-ui/plugin.json
- Version: 0.1.1
- Category (editorial): other
- Skills: 6 (figma-ui-design-to-code, figma-ui-generate-design, figma-ui-generate-diagram, figma-ui-generate-library, figma-ui-use-motion, figma-ui-use)
- MCP servers: 1 (figma-ui-mcp)
- Stars: 0
- Repository created: 2026-09-22
- Repository last pushed: 2026-09-23
- Publisher type: Organization
- Listing: https://agentpluginsdirectory.com/plugins/figma-ui
- Schema: https://agent-plugins.org/schemas/1.0.0/plugin.schema.json

## What figma-ui does, in the publisher's words

figma-ui is a portable Agent Plugin for creating, inspecting, editing, and maintaining Figma documents through the local/open-source figma-ui-mcp bridge.

The plugin is displayed as Figma UI in Codex. Its icon is sourced from the installed Figma Desktop application and is used to identify compatibility with Figma. This plugin is developed by JALA and is not an official Figma product.

GitHub: Figma UI plugin.

- figma-ui-use: the runtime and safety foundation for real figma-ui-mcp calls.
- figma-ui-generate-design: container-first generation and iterative visual QA for complete screens.
- figma-ui-generate-library: variables, tokens, components, variants, and reusable design-system foundations.
- figma-ui-design-to-code: high-fidelity local design context, assets, CSS, and component mapping for implementation.
- figma-ui-generate-diagram: editable diagrams assembled from frames, text, vectors, and lines in an existing Figma file.
- figma-ui-use-motion: prototype reactions, transitions, and scroll behavior when exposed by the connected bridge; otherwise reports the capability gap and supports static-state fallbacks.

From the project README, punctuation lightly normalized. Full text: https://raw.githubusercontent.com/Atnic/jala-agent-plugins/HEAD/figma-ui/README.md

## Skills

- figma-ui-design-to-code: Implement Figma designs as production code using figma-ui-mcp design context, local assets, CSS inspection, component mapping, and visual verification.
- figma-ui-generate-design: Build or substantially modify complete Figma screens with container-first Auto Layout, component reuse, design-system discovery, and screenshot-based visual verification through figma-ui-mcp.
- figma-ui-generate-diagram: Create or update editable flowcharts, architecture diagrams, sequence diagrams, state diagrams, ER diagrams, and timelines in an existing Figma file through figma-ui-mcp.
- figma-ui-generate-library: Create or evolve Figma variables, design tokens, styles, components, variants, and reusable design-system foundations through figma-ui-mcp.
- figma-ui-use-motion: Add, inspect, and maintain the prototype interactions, transitions, and scroll behavior supported by figma-ui-mcp without inventing unsupported keyframe or timeline APIs.
- figma-ui-use: Use figma-ui-mcp safely for non-trivial Figma reads and writes, with mandatory discovery, Auto Layout, token, component, editing, and screenshot-verification practices.

Descriptions come from the frontmatter of each SKILL.md, punctuation lightly normalized.

## MCP servers

- figma-ui-mcp: transport: stdio; command: npx -y figma-ui-mcp@2.5.26

Read from the plugin's own mcp.json. Environment variable names only, never values.