schudarin
UserField-tested Figma skills for Claude Code and Codex: Plugin API gotchas, design process, DS audit, variable repair, flow planning
Categories
Indexed Skills (5)
figma-audit-design-system
Analyze, audit, inventory, and document an existing Figma design system through the Figma MCP server — components, variables, tokens, patterns, design debt, usage rules, causal relationships — and create design-system documentation pages in Figma on request. Use when the user asks to audit, inventory, map, document, or find debt in a Figma file, page, frame, component set, or selection. Read-only by default; modify Figma only when the user explicitly asks. Not for designing or building screens — that is figma-design-screens; not for repairing broken variable bindings — that is figma-fix-variable-bindings.
figma-design-screens
Use when designing, building, or changing a product screen, flow, or component in Figma — new screens, states, redesigns, or edits to already-approved work. Use when a design result was rejected, when a screen must match an existing product, or when starting design on a product with no visual direction yet. Not for auditing or documenting an existing design system without changing screens — that is figma-audit-design-system.
figma-fix-variable-bindings
Fix detached or missing variable bindings in Figma — typography (fontFamily, fontStyle, fontSize, fontWeight), padding/spacing (paddingTop/Right/Bottom/Left, itemSpacing, counterAxisSpacing), corner radii (cornerRadius, topLeftRadius, topRightRadius, bottomLeftRadius, bottomRightRadius), and colors (solid fills and strokes). Trigger when the user mentions detached styles, deleted variables, broken bindings, "Variable was deleted" warnings, wrong fonts, manual/hardcoded padding, unbound spacing, hardcoded corner radius / rounding, detached/hardcoded colors, unbound fills or strokes, broken color variables, or asks to audit/clean up/fix variables across a file or page. Covers the full scan → report → confirm → rebind workflow; read-only until the user approves the report. Trigger even if only one of typography/padding/roundings/colors is mentioned.
figma-plan-user-flows
Plan user flows and screen states for a Figma design before any designing starts. Use when asked to plan a user flow, map out screens for a feature, define screen states, plan a Figma file structure, or work out what needs to be designed before opening Figma. Produces a complete flow map with all screens, states, entry/exit points, and a suggested Figma page structure.
figma-plugin-api-rules
MANDATORY prerequisite before any programmatic Figma write — use_figma, create_new_file, Plugin API scripts. Field-tested pitfalls and patterns for the Figma Plugin API — nodes, auto-layout, components and variants, instances, text and fonts, variables and modes, connectors, annotations, FigJam, and the MCP tool layer — plus verification recipes so silent failures get caught. Load it in addition to your tool's own instructions for calling the Figma API (figma-use or its MCP-resource equivalent); it complements them, never replaces them. Do not load for tasks that don't touch Figma.
Bio shown is the top-scored skill's repo description as a fallback — real GitHub bios land in a future update.