agentmods.dev

t-figma-assets

t-figma-assets is a skill for Claude Code from timzaak/web-dev-skills. It costs 28 tokens per session (960 once invoked), scanned A, original, Apache-2.0.

A process for finding, downloading, converting, placing, and checking visual assets from a Figma design. Assets can include images, videos, icons, and flattened groups containing text or effects.

In plain words
What is it for?
Use it to inspect Figma files, collect matching assets, export composite visuals when needed, convert files, place them in the project, and create an asset manifest.
Why use it?
It prevents missing, wrongly converted, or incorrectly placed design assets during a Figma implementation.

Skill for Claude Code

Written for Claude Code: allowed-tools in frontmatter. Also seen: mentions CLAUDE.md; mentions subagents; names the AskUserQuestion tool.

Runs only inside its plugin — its command needs a path that Claude Code sets for a plugin’s own hooks and for nothing else. Install the plugin, not this.

Part of the t-tools plugin — 29 skills, 31 agents shipped together

not rated 74repo +5 changed 4d ago A scan 28 tokens original Apache-2.0

Good fit Use it to inspect Figma files, collect matching assets, export composite visuals when needed, convert files, place them in the project, and create an asset manifest.

Compare 6 skills from other repositories ↓
View source ↗ timzaak/web-dev-skills
Install

Getting it into your agent

This one installs as part of its plugin. Adding the marketplace and installing the plugin brings it with everything else the plugin ships.

Claude Code
/plugin marketplace add timzaak/web-dev-skills
Claude Code
/plugin install t-tools

Made for: Claude Code.

Or install t-tools, the plugin that ships this one along with the rest of its 29 skills, 31 agents.

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 t-figma-assets

README.md
[![agentmods](https://agentmods.dev/badge/skills/timzaak/web-dev-skills/t-figma-assets/github.svg)](https://agentmods.dev/skills/timzaak/web-dev-skills/t-figma-assets)
Your own site
<a href="https://agentmods.dev/skills/timzaak/web-dev-skills/t-figma-assets"><img src="https://agentmods.dev/badge/skills/timzaak/web-dev-skills/t-figma-assets/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 t-figma-assets

Your own site · 80×15
<a href="https://agentmods.dev/skills/timzaak/web-dev-skills/t-figma-assets"><img src="https://agentmods.dev/badge/skills/timzaak/web-dev-skills/t-figma-assets.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 960 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.00960
Opus 5 $0.00014 $0.00480
Sonnet 5 $0.00006 $0.00192
Haiku 4.5 $0.00003 $0.00096

Measured 4d ago against content hash ded81a0ea685, method: parsed. Prices are Anthropic first-party input rates as of 2026-09-09, from the pricing page.

Security

Grade A, and why

t-figma-assets 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 4d 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/t-figma-assets/SKILL.md · 49 lines

What it actually says

Figma 素材准备

运行时边界：${CLAUDE_PLUGIN_ROOT}/protocols/runtime-boundaries.md（判断产物写入位置或项目事实与插件默认冲突时读） 共享契约：${CLAUDE_PLUGIN_ROOT}/protocols/figma-workflow-contract.md（校验 session、决定素材扁平化或写 manifest 前读） 执行方法：${CLAUDE_PLUGIN_ROOT}/guides/figma/assets.md（进入素材发现、下载或转换前读）

只负责素材发现、下载、合成导出、转换、落位与 manifest；不得实现或精修 UI。

输入和关联

解析主 Figma URL、已存在的目标文件、重复 --asset-url 和 --video-source nodeId=source。调用 ${CLAUDE_PLUGIN_ROOT}/scripts/figma-session.py resolve 校验并规范化 target-file，session 复用/归档/创建/多选决策按共享契约的 Session Resolve 表执行。

开始前读取目标项目 AGENTS.md/CLAUDE.md、目标文件邻近资产用法、DESIGN.md（若有）、docs/figma-rules.md（若有）和当前 session 候选。探测正式资产目录、命名和引用方式；存在多个同等合理目录时询问。

工作流

  1. 同一 MCP 窗口内保存主节点 metadata、design context、screenshot、variables 到 session source/；这些文件后续不得覆盖。
  2. 从主节点收集素材。缺失时用无 nodeId metadata 列 pages，再按 metadata 筛选同文件候选；显式 --asset-url 直接加入。匹配不唯一时展示 page/node/name/size 询问，不盲选。
  3. 图片上存在文字时检查最小共同视觉父节点。无交互、动态或本地化语义则选定该父节点并标记 flattened；否则询问。
  4. 确认图片、图标或合成父节点后，必须调用 Figma MCP download_assets 导出；不得把 get_design_context 返回的素材 URL 直接作为下载源。defaultScale 默认传 3，banner、hero 和主要内容图保持 3 倍；仅明确属于小型、非关键的图标或装饰素材时传 2。将 download_assets 返回的临时 URL 立即下载到 raw。视频没有 MCP 源时按 node id 使用 --video-source；缺失则停止并要求 URL 或项目内本地文件。
  5. 按 ${CLAUDE_PLUGIN_ROOT}/protocols/subagent-dispatch.md 注入并委派 figma-assets，完成转换、落位、hash 和 manifest；由 download_assets 导出的条目将 manifest source 记录为 download-assets。
  6. 无素材时也写 []。全部成功后把 session stage 设为 assets，更新 index。

门禁

  • 图片转换和视频处理调用 ${CLAUDE_PLUGIN_ROOT}/scripts/figma-assets.py；缺 ffmpeg/ffprobe 时停止并给安装提示。
  • 同名同 hash 复用，同名异 hash 停止；不写半成功 manifest。
  • 只记录经过本次证据支持的规则候选，不直接写 docs/figma-rules.md；规则晋升在 impl/fix 验收收敛后进行。
  • 输出下载、合成、转换、复用、失败项和 manifest 路径，不声称完成 UI。
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. 4d ago Changed ded81a0ea685
  2. 6d ago Changed ca9d05287705
  3. 9d ago First seen · 49 lines · 28 tokens per session scan A 9681972742df

Subscribe to this mod's changes

t-figma-assets is a skill published in the GitHub repository timzaak/web-dev-skills (74 stars, last pushed yesterday), licensed Apache-2.0. It adds 28 tokens to every session and 960 once invoked, about $0.0001 per session on Opus 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.

Design and UXai-codingskills
Related

Other skills, from other repositories

fireworks-tech-graph

A generator for technical diagrams that exports them as SVG and PNG images. It is intended for architecture, data-flow, flowchart, sequence, agent, memory, and concept-map diagrams.

boshi-xixixi/TraeSkill · 105 tokens

draw-io-diagram-generator

Use when creating, editing, or generating draw.io diagram files (.drawio, .drawio.svg, .drawio.png). Covers mxGraph XML authoring, shape libraries, style strings, flowcharts, system architecture, sequence diagrams, ER diagrams, UML class diagrams, network topology, layout strategy, the hediet.vscode-drawio VS Code…

boshi-xixixi/TraeSkill · 94 tokens

cognitive-walkthrough

Deep-dive usability evaluation of specific user tasks. Simulates novice user cognition step-by-step to identify learnability issues, unclear actions, and points of confusion.

mastepanoski/claude-skills · 38 tokens

design

Check design-system and UI consistency for diffs that touch user-facing surfaces. Use for visual changes, design checks, or as the UI stage of $ship, including small component, style, copy, and layout changes.

magarcia/skills · 46 tokens

ui-design-review

Comprehensive visual design and aesthetics evaluation. Analyzes typography, color, spacing, hierarchy, consistency, branding, and current product-category conventions for polished, professional interfaces.

mastepanoski/claude-skills · 38 tokens

ux-audit-rethink

Comprehensive UX audit using IxDF's 7 factors, 5 usability characteristics, and 5 interaction dimensions. Holistic evaluation with redesign proposals based on user-centered design principles.

mastepanoski/claude-skills · 42 tokens