Sponsor Suno AI Music arrow_forward
Plugin

Figma Pack

Claude Code skill pack for Figma (30 skills)

Type
Plugin
GitHub stars
2.8k
License
MIT
Repo last updated
Sep 27, 2026
Version
1.6.0
Author
Jeremy Longshore

What Figma Pack is

Figma Pack is a plugin published in the jeremylongshore/tons-of-skills-marketplace repository on GitHub, which has about 2.8k stars. The repository describes itself as: “Model-agnostic agent-skills platform with a harness-free canonical layer, verified adapters, and the ccpi package manager. Explore at tonsofskills.com.”

A plugin is a package that bundles skills, slash commands, subagents, hooks, and MCP connectors so they install together. Plugins are plain files with a manifest at .claude-plugin/plugin.json, and they work in both Claude Code and Claude Cowork.

Installing Figma Pack adds everything it ships in one step. Connectors inside a plugin still need to be connected separately, and hooks and subagents only run in Cowork and Claude Code, not in regular chat.

How to install Figma Pack

Claude Code

  1. Add the repository as a plugin marketplace: claude plugin marketplace add jeremylongshore/tons-of-skills-marketplace
  2. Install the plugin: claude plugin install figma-pack@<marketplace-name>, using the marketplace name from the repository's .claude-plugin/marketplace.json.
  3. Restart the session if the new skills or commands don't appear straight away.

Claude Cowork

  1. Open Customize → Plugins and choose Add marketplace.
  2. Enter jeremylongshore/tons-of-skills-marketplace (the owner/repo shorthand works for GitHub).
  3. Find Figma Pack in the list, click Install, then connect any connectors it needs from its Connectors tab.

New to extending Cowork? Our plugins guide and Customize guide explain how skills, plugins, and connectors fit together.

Inside the source file

An excerpt from plugins/saas-packs/figma-pack/.claude-plugin/plugin.json, shared under the repository's MIT license. Read the full file on GitHub.

> 30 production-grade Claude Code skills for the Figma REST API and Plugin API

Build design-to-code pipelines, extract design tokens, export assets, handle webhooks, and manage Enterprise features -- all with real Figma API endpoints, actual response shapes, and working TypeScript code.

Quick Start

# Install
/plugin install figma-pack@claude-code-plugins-plus

# Set up authentication
export FIGMA_PAT="figd_your-personal-access-token"
export FIGMA_FILE_KEY="your-file-key-from-figma-url"

# Try it
"Help me extract design tokens from my Figma file"
"Export all icons from my Figma components as SVG"
"Set up a webhook to sync tokens when my Figma file changes"

What's Covered

Skills

Standard (S01-S12)

Pro (P13-P18)

Flagship (F19-F24)

Flagship+ (X25-X30)

Key Concepts

Authentication: Figma uses Personal Access Tokens (PATs) with the X-Figma-Token header, or OAuth 2.0 for user-facing apps. PATs expire after 90 days max.

Rate Limits: Leaky bucket algorithm, per-user per-minute. On 429, read the Retry-After header. Limits vary by plan tier and endpoint tier (1/2/3).

Webhooks V2: Event-driven notifications via POST /v2/webhooks. Authenticated with a passcode field echoed in each payload (not HMAC signatures).

Image Export: GET /v1/images/:key renders nodes as PNG/SVG/JPG/PDF. URLs expire after 30 days. SVGs always export at 1x regardless of scale parameter.

Variables API: Enterprise-only. GET /v1/files/:key/variables/local for design tokens. All other plans use the styles API (file.styles in the file response).

Resources

  • Figma REST API
  • Figma Plugin API
  • Figma Webhooks V2
  • Figma API OpenAPI Spec
  • Figma Status Page

License

MIT

Before you install

  • Read the whole file first. Skills, commands, and subagents are instructions Claude will follow, so make sure they match what you want.
  • Check which tools, scripts, or MCP servers it uses. Local servers and scripts run with your permissions.
  • Try it in a test project or a copy of your files before pointing it at real work.
  • Pin the version you tested, and review changes before updating.
  • Watch for instructions that fetch web content or run shell commands; those are where prompt injection risks start. See our prompt injection guide.

FAQ

What is Figma Pack?

Figma Pack is a plugin for Claude Code and Claude Cowork from the jeremylongshore/tons-of-skills-marketplace repository on GitHub. Claude Code skill pack for Figma (30 skills)

How do I install Figma Pack in Claude Code?

Add the repository as a plugin marketplace: claude plugin marketplace add jeremylongshore/tons-of-skills-marketplace Install the plugin: claude plugin install figma-pack@<marketplace-name>, using the marketplace name from the repository's .claude-plugin/marketplace.json. Restart the session if the new skills or commands don't appear straight away.

Can I use Figma Pack in Claude Cowork?

Open Customize → Plugins and choose Add marketplace. Enter jeremylongshore/tons-of-skills-marketplace (the owner/repo shorthand works for GitHub). Find Figma Pack in the list, click Install, then connect any connectors it needs from its Connectors tab.

Is Figma Pack safe to install?

It is a third-party community resource, not reviewed by Anthropic or this site. Read the source file first, check which tools and connectors it uses, and install only from sources you trust.

Similar resources

Browse all skills, subagents, and plugins →

Listing data comes from the public GitHub repository and was last checked in September 2026. Excerpts are © their authors and shared under MIT. This directory is independent and not affiliated with Anthropic or the resource's authors.