What common errors does this skill prevent?

It specifically addresses frequent pitfalls like modifying read-only arrays, failing to load fonts before text edits, and blocking the main thread with heavy operations.

Can I use this for FigJam widgets?

Yes, the skill includes guidance for Design plugins, FigJam plugins, and interactive widgets, accounting for their different constraints and UI requirements.

Does it handle TypeScript type safety?

Absolutely. It includes patterns for type guards and typed message interfaces to ensure robust, error-free communication between the plugin's UI and main thread.

How does this skill help with Figma plugin development?

It provides Claude with specific architectural knowledge of Figma's dual-threaded system, ensuring it can correctly write code for both the logic sandbox and the UI iframe.

Figma Plugin Development

Name: Figma Plugin Development
Author: srstomp

bysrstomp

•

Design Tools

Develops powerful Figma plugins using the Plugin API, including node manipulation, UI integration, and design automation.

This skill equips Claude with the domain-specific knowledge required to build robust Figma and FigJam plugins. It covers the dual-threaded architecture (Main sandbox and UI iframe), provides patterns for postMessage communication, and offers implementation details for node manipulation, property updates, and async font loading. It is an essential resource for developers creating design automation tools, asset generators, or workflow utilities within the Figma ecosystem, ensuring best practices and efficient API usage.

Key Features

01Comprehensive node manipulation for shapes, text, and components

02Advanced property management using Figma mixins and type guards

03Orchestrates communication between Figma's Main and UI threads

04Standardized patterns for async font loading and batch operations

05Implements persistent storage via clientStorage and pluginData

062 GitHub stars

Use Cases

01Creating data-driven plugins that sync Figma layers with external APIs

02Building design automation tools like layer renamers or asset generators

03Developing custom UI panels for complex design system management

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add srstomp/pokayokay figma-plugin

For use in Claude.ai and ChatGPT

Download Skill