All Skills
Design & CreativeClaude Plugins (Official)

figma — Agent Skill

by figma · Updated

Figma design platform integration. Access design files, extract component information, read design tokens, and translate designs into code. Bridge the gap between design and development workflows.

At a glance

figma is an Agent Skill by figma in the Design & Creative category. In Claude Code it installs with `/plugin install figma@claude-plugins-official` after adding the anthropics/claude-plugins-official marketplace; other assistants use its SKILL.md instructions as rules. Its source repository has 2,127 GitHub stars (as of Oct 28, 2026).

Source 2.1kGitHub stars

How to install figma in your AI client

Setup for Claude Code, Claude Desktop, Cursor, Codex, Windsurf, Cline and VS Code — copy-paste ready.

How to install figma in Claude CodeAnthropic's agentic CLI

  1. Add the marketplace

    claude
    /plugin marketplace add anthropics/claude-plugins-official

  2. Install the skill

    claude
    /plugin install figma@claude-plugins-official

  3. Use it

    These are slash commands for a Claude Code session, not your shell. Claude auto-invokes the skill when your request matches its description — or type its slash command if it exposes one.

Documentation

Full README

Figma MCP Server Guide

The Figma MCP server brings Figma directly into your workflow by providing important design information and context to AI agents generating code from Figma design files.

[!NOTE] Rate limits apply to Figma MCP server tools that read data from Figma. Some tools, such as those that write to Figma files, are exempt from the rate limits. Users on the Starter plan or with View or Collab seats on paid plans will be limited to up to 6 tool calls per month. Users with a Dev or Full seat on the Professional, Organization, or Enterprise plans have per minute rate limits, which follow the same limits as the Tier 1 Figma REST API. As with Figma’s REST API, Figma reserves the right to change rate limits.

For the complete set of Figma MCP server docs, see our developer documentation. By using the Figma MCP server and the related resources (including these skills), you agree to the Figma Developer Terms. These skills are currently available as a Beta feature.

Features

  • Write to the canvas (remote server only): Create and modify native Figma content directly from your MCP client. With the right skills, agents can build and update frames, components, variables, and auto layout in your Figma files using your design system as the source of truth.

Note: We're quickly improving how Figma supports AI agents. The write to canvas feature will eventually be a usage-based paid feature, but is currently available for free during the beta period.

  • Generate placeholder images: When source, captured, or library images are unavailable, agents can use generate_image after asking permission and disclosing Figma AI credit usage. Generated images are uploaded with upload_assets and applied to the design.
  • Generate code from selected frames

Select a Figma frame and turn it into code. Great for product teams building new flows or iterating on app features.

  • Extract design context

Pull in variables, components, and layout data directly into your IDE. This is especially useful for design systems and component-based workflows.

  • Code smarter with Code Connect

Boost output quality by reusing your actual components. Code Connect keeps your generated code consistent with your codebase.

Excerpt — the full document is on GitHub.

More Design & Creative skills

Catalog data refreshed . Something wrong? Report it.