talk-to-figma-design

talk-to-figma-design is a skill for Claude Code, Codex from richardplg2/figma-annotations. It costs 28 tokens per session (1,586 once invoked), scanned A, original, MIT.

A design-planning helper for Figma, a collaborative interface-design tool. It reads an exported Figma design prompt, combines it with information from Figma and the codebase, and produces a design specification for brainstorming.

In plain words
What is it for?
Use it to gather requirements from Figma, inspect related code, and prepare a design specification; it does not implement the code.
Why use it?
It turns design notes and existing project context into a clearer plan before implementation begins.

Skill for Claude CodeCodex

Written for no agent in particular: nothing here depends on one.

Good fit Use it to gather requirements from Figma, inspect related code, and prepare a design specification; it does not implement the code.

Compare 6 skills from other repositories ↓
Install with agentmods
npx agentmods add skills/richardplg2/figma-annotations/talk-to-figma-design
Install

Getting it into your agent

One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.

Any agent
npx skills add richardplg2/figma-annotations --skill talk-to-figma-design
Clone the repo
git clone --depth 1 https://github.com/richardplg2/figma-annotations

Made for: Claude Code, Codex.

Wrote this? Show the measurements

A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.

agentmods badge for talk-to-figma-design

README.md
[![agentmods](https://agentmods.dev/badge/skills/richardplg2/figma-annotations/talk-to-figma-design/github.svg)](https://agentmods.dev/skills/richardplg2/figma-annotations/talk-to-figma-design)
Your own site
<a href="https://agentmods.dev/skills/richardplg2/figma-annotations/talk-to-figma-design"><img src="https://agentmods.dev/badge/skills/richardplg2/figma-annotations/talk-to-figma-design/github.svg" alt="Measured on agentmods" height="20"></a>

Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.

agentmods 80×15 button for talk-to-figma-design

Your own site · 80×15
<a href="https://agentmods.dev/skills/richardplg2/figma-annotations/talk-to-figma-design"><img src="https://agentmods.dev/badge/skills/richardplg2/figma-annotations/talk-to-figma-design.svg" alt="Reviewed on agentmods" width="80" height="20"></a>
Per session 28 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 1,586 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. A grade says what 26 rules found in the file — not that it is safe.
Origin original No closer match found in the catalogue.
Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

ModelPer sessionOnce invoked
Fable 5.1 $0.00028 $0.01586
Opus 5.5 $0.00011 $0.00634
Sonnet 5.5 $0.00006 $0.00317
Haiku 4.5 $0.00003 $0.00159

Measured 2mo ago against content hash 55eedbd11a21, method: parsed. Prices are Anthropic first-party input rates as of 2026-10-07, from the pricing page.

Security

Grade A, and why

talk-to-figma-design scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 2mo ago.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Nothing flagged

None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.

skills/talk-to-figma-design/SKILL.md · 164 lines

How it starts

The opening of the file, as written. The whole thing — 164 lines — stays where its author put it; the contents beside it link to each section on GitHub.

talk-to-figma-design

Collect Figma design requirements, enrich them with live Figma data and codebase analysis, then hand off to the brainstorming pipeline for implementation planning.

Trigger

User invokes /talk-to-figma-design after pasting a markdown prompt exported from the figma-annotations VS Code extension.

Arguments (all optional):

  • --channel <id> — override channel ID from prompt
  • --collection "<name>" — process only the named collection's items
  • <topic> — free text topic name for the spec file (default: derived from first frame name)

Prerequisites

  • cursor-talk-to-figma MCP server running (bun socket on port 3055)
  • Figma plugin active in the Figma file
  • GitNexus index available in the current project (optional — skipped gracefully if missing)

Workflow

Follow these steps in order. Do NOT skip steps. Do NOT implement any code — this skill only collects, enriches, and generates a spec.

Step 1: Parse Prompt

  1. Scan the conversation for the <!-- talk-to-figma-design --> marker
  2. If no marker found, tell the user: "No Figma design prompt found. Export collections from the figma-annotations VS Code extension first using 'Export Collections as Prompt'."
  3. Extract from the prompt:
    • Channel ID from the ## Connection section
    • Design frames with their nodeIds, names, types, dimensions, notes, and collection names
    • Code references with file paths, line ranges, language, code, notes, and collection names
  4. If --channel argument provided, use it instead of the prompt's channel ID
  5. If --collection argument provided, filter to only items from that collection

Step 2: Enrich from Figma MCP

Use the cursor-talk-to-figma MCP tools to gather detailed design data.

  1. Connect: Call join_channel with the resolved channel ID
  2. For each design frame nodeId:
    • Call get_node_info(nodeId) — capture children hierarchy, layout properties, auto-layout settings
    • Call scan_text_nodes(nodeId) — capture all text content within the frame
  3. Global design data:
    • Call get_styles() — capture color tokens, typography, effects
    • Call get_local_components() — capture available component library

Read the full file on GitHub · 164 lines

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

  1. 2mo ago First seen · 164 lines · 28 tokens per session scan A 55eedbd11a21

Subscribe to this mod's changes

talk-to-figma-design is a skill published in the GitHub repository richardplg2/figma-annotations (11 stars, last pushed 7mo ago), licensed MIT. It adds 28 tokens to every session and 1,586 once invoked, about $0.0001 per session on Opus 5.5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.

Related

talk-to-figma-design compared with skills from other repositories

talk-to-figma-design next to 6 skills from other repositories
ModTypeStarsLast pushLicenceScanTokensWorks with
talk-to-figma-designrichardplg2/figma-annotationsSkill117mo agoMITA28Claude Code, Codex
figma-codegenawdr74100/figwrightSkill1.3kyesterdayMITA145Claude Code, Codex
figma-buildawdr74100/figwrightSkill1.3kyesterdayMITA180Claude Code, Codex
mk:figmangocsangyem/MeowKitSkill156d agoMITA99Claude Code
build-from-figmaPMDevSolutions/AureliusSkill9yesterdayMITA0Claude Code
screenshot-intakePMDevSolutions/AureliusSkill9yesterdayMITA0Claude Code
visual-qa-verificationPMDevSolutions/AureliusSkill9yesterdayMITA81Claude Code