pi-figma

Pi package for Figma integration — inspect files, components, styles, nodes, export assets, and read comments directly from Figma's REST API.

Package details

← Back
extensionskill

Install pi-figma from npm and Pi will load the resources declared by the package manifest.

npm report
$ pi install npm:pi-figma
Package
pi-figma
Version
1.0.0
Published
Apr 24, 2026
Downloads
26/mo · 26/wk
Author
lucianojr
License
MIT
Types
extension, skill
Size
42.1 KB
Dependencies
0 dependencies · 3 peers
Pi manifest JSON
{
  "extensions": [
    "./extensions/figma.ts"
  ],
  "skills": [
    "./skills"
  ]
}

Security note

Pi packages can execute code and influence agent behavior. Review the source before installing third-party packages.

README

pi-figma

Pi package for Figma integration — inspect files, components, styles, nodes, export assets, and read comments directly from Figma's REST API.

No MCP server needed. Zero runtime dependencies. Pure Figma REST API.

Install

pi install npm:pi-figma

Setup

Create ~/.pi/agent/figma.json:

{
  "personalAccessToken": "figd_your_token_here",
  "outputDir": "./figma-assets",
  "teamId": "optional-team-id-for-search"
}

Get a Personal Access Token at: https://www.figma.com/developers/api#access-tokens

Or use environment variables:

  • FIGMA_PERSONAL_ACCESS_TOKEN
  • FIGMA_TEAM_ID

Tools

Tool Description
figma_get_file Get file structure, pages, and node tree
figma_get_components List published components and component sets
figma_get_styles List design styles — colors, text, effects, grids
figma_inspect_node Inspect a node: fills, strokes, typography, auto-layout, effects
figma_export_assets Export nodes as PNG, SVG, PDF, or JPG
figma_get_comments List comments and design feedback
figma_search Search team files by name
figma_get_images Get download URLs for image fills

Usage Examples

> Inspect the Figma file https://www.figma.com/file/abc123/My-Design

> Get all styles from Figma file abc123

> Export nodes 1:23 and 4:56 from file abc123 as SVG

> Show me the comments on the payment flow design file

Features

  • 🎨 Full Figma REST API — files, components, styles, nodes, images, comments
  • 🔍 Smart URL parsing — accepts full Figma URLs or bare file keys
  • 📦 Asset export — download PNG/SVG/PDF/JPG with configurable scale
  • 🎯 Node inspection — CSS-ready properties: fills, strokes, typography, auto-layout
  • 💬 Design feedback — read comments and resolved status
  • 🔒 Config flexibility — JSON config, env vars, or ENV: prefix for secrets
  • 🖥️ Rich TUI rendering — custom display for every tool in pi's terminal UI
  • 📋 Figma skill — contextual guidance for working with Figma designs

License

MIT