Agent skill

Figma From Code Discovery Assets

by bitovi in bitovi/ai-enablement-prompts

Subagent for figma-from-code Phase 0b. An agent skill from bitovi/ai-enablement-prompts.

MITAuto-check passedSecurity

Install Figma From Code Discovery Assets

skills CLI
$ npx skills add bitovi/ai-enablement-prompts --skill figma-from-code-discovery-assets -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install bitovi/ai-enablement-prompts figma-from-code-discovery-assets --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/bitovi/ai-enablement-prompts.git skills-src && mkdir -p .claude/skills && cp -r skills-src/plugins/figma-from-code/skills/figma-from-code/2-discovery-assets .claude/skills/figma-from-code-discovery-assets && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
figma-from-code-discovery-assets
GitHub stars
121
Token cost
~1.4k tokens
SKILL.md length
404 words
Files
2
Skills in repo
40
Repo updated
First seen
Licence
MIT

At a glance

Subagent for figma-from-code Phase 0b. An agent skill from bitovi/ai-enablement-prompts.

  • Works in 5 steps: Ensure output directory exists → Run the icon extraction script → Read and summarize the output → …
  • Tasks that involve Static analysis and SAST
  • SKILL.md covers When to Use, Prerequisites, Required Inputs and Output Files, plus 4 more sections
  • Calls node

What it does

Figma From Code Discovery Assets is an agent skill from bitovi/ai-enablement-prompts. Subagent for figma-from-code Phase 0b. Discovers all Lucide icons and SVG file assets imported across the codebase via static analysis. Extracts SVG markup and maps which components use which icons. No dev server or Figma access needed.

Its SKILL.md is about 1.4k tokens, which your agent loads only when the skill is triggered. The skill folder holds 1 other file (for example `README.md`).

It sits in Security, covering Static analysis and SAST and Subagents. It works with Figma and React. The repository describes itself as: Prompts Bitovi uses for software development. The licence is MIT.

When your agent uses it

  • Tasks that involve Static analysis and SAST
  • Tasks that involve Subagents

Example prompts

  • “/figma-from-code-discovery-assets”

Workflow steps

5 steps, taken from the step headings in SKILL.md.

  1. Ensure output directory exists
  2. Run the icon extraction script
  3. Read and summarize the output
  4. Write icons summary for the orchestrator
  5. Report

What it can do on your machine

Read from SKILL.md and the folder at commit df229b1. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Shell commands in SKILL.md call:

    • node

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Figma From Code Discovery Assets loads about 1.4k tokens when it runs. Until then it costs about 67 tokens; SKILL.md has 404 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~67
When it runs · the whole SKILL.md, loaded when a task matches
~1.4k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from bitovi/ai-enablement-prompts at commit df229b1, republished under its MIT licence (© bitovi). 404 words, ~1,435 tokens.

Download SKILL.mdSave it as .claude/skills/figma-from-code-discovery-assets/SKILL.md (or your agent's skills folder). This skill also uses 1 other file; get the full folder from GitHub.
name
figma-from-code-discovery-assets
description
Subagent for figma-from-code Phase 0b. Discovers all Lucide icons and SVG file assets imported across the codebase via static analysis. Extracts SVG markup and maps which components use which icons. No dev server or Figma access needed.
model
claude-sonnet-4-5

Skill: Icon & Asset Discovery

Discovers all Lucide icons and SVG file assets imported across the codebase, extracts their SVG markup, and maps which components use which icons. This is pure static analysis — no dev server or Figma access needed.

When to Use

  • Before figma-from-code Phase 3 (icon preamble builds Figma icon components from this data)
  • Standalone audit of icon and asset usage across the codebase
  • When resuming a build and icons.json is missing

Prerequisites

  • Source directory exists at {sourceDir} (the directory containing the project's component source files)
  • node_modules/lucide-react installed (for resolving icon SVG data; only required when config.iconLibrary is lucide-react)

Placeholders like {sourceDir} resolve from state.json → config. When config.iconLibrary is null or the lucide-react package is absent, icon extraction is skipped and an empty icons array is written to icons.json — the phase still completes and records totalIcons: 0 in the summary.

Required Inputs

InputDescription
sourceDirPath to the source directory to scan (from state.json → config.sourceDir)

Output Files

Written to .temp/figma-from-code/:

FileContents
icons.jsonIcon/asset manifest with SVG strings and per-component mapping
icons.json structure
json
{
  "icons": [
    {
      "name": "Check",
      "elements": [["path", { "d": "M20 6 9 17l-5-5" }]],
      "svgString": "<svg ...>...</svg>",
      "usedBy": ["Button", "Checkbox"]
    }
  ],
  "assets": [
    {
      "name": "AppLogoSvg",
      "importPath": "@/assets/logo.svg",
      "sourcePath": "{sourceDir}/assets/logo.svg",
      "svgString": "...",
      "usedBy": ["Header"]
    }
  ],
  "iconsByComponent": {
    "Button": ["Check", "X"],
    "Header": ["AppLogoSvg"]
  },
  "summary": {
    "totalIcons": 21,
    "totalAssets": 1,
    "componentsWithIcons": 22
  }
}

Workflow

1. Ensure output directory exists
bash
mkdir -p .temp/figma-from-code/
2. Run the icon extraction script
bash
node {skillRoot}/scripts/extract-icons.js \
  --scan {sourceDir} \
  --output .temp/figma-from-code/icons.json

The script:

  • Recursively finds all .tsx? files (excludes node_modules, test files)
  • Parses static imports from lucide-react
  • Resolves each icon's SVG from node_modules/lucide-react/dist/esm/icons/
  • Finds and extracts SVG file imports (e.g., import Logo from '@/assets/logo.svg')
  • Maps which components use which icons/assets
Show full SKILL.md (179 more words)Show less
3. Read and summarize the output

Read .temp/figma-from-code/icons.json and extract:

  • summary.totalIcons — number of Lucide icons found
  • summary.totalAssets — number of SVG file assets found
  • summary.componentsWithIcons — how many components use icons
  • icons[].name — list of icon names
  • assets[].name — list of asset names
4. Write icons summary for the orchestrator

Extract the data the orchestrator needs into a small summary file so it never has to read the full icons.json (which contains SVG strings):

bash
node -e "
  const data = JSON.parse(require('fs').readFileSync('.temp/figma-from-code/icons.json','utf-8'));
  const summary = {
    iconCount: data.summary.totalIcons,
    icons: data.icons.map(i => i.name),
    assetCount: data.summary.totalAssets,
    assets: data.assets.map(a => a.name)
  };
  require('fs').writeFileSync('.temp/figma-from-code/icons-summary.json', JSON.stringify(summary, null, 2));
"

Write to .temp/figma-from-code/icons-summary.json. The orchestrator reads only this file (~500 bytes) instead of the full icons.json.

5. Report
Icon & Asset Discovery complete:
- {totalIcons} Lucide icons discovered
- {totalAssets} SVG assets found
- Icons used across {componentsWithIcons} components

Scripts Reference

ScriptLocationPurpose
extract-icons.js{skillRoot}/scripts/extract-icons.jsStatic analysis of imports to find icons/assets and extract SVG data

Do NOT modify this script.

Skip / Resume

If called with resume: true, check whether .temp/figma-from-code/icons.json exists on disk. If it does, skip and read the existing file. If it's missing, re-run.

Error Handling

ScenarioAction
extract-icons.js failsVerify the source directory exists and node_modules/lucide-react is installed
Icon SVG resolution failsScript logs warnings per-icon; other icons still extracted
SVG file asset not found on diskScript logs warning; asset entry created without svgString

© bitovi, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 1 other file in plugins/figma-from-code/skills/figma-from-code/2-discovery-assets of bitovi/ai-enablement-prompts.

  • SKILL.md
  • README.md

Open the folder on GitHubat commit df229b1

Compare with similar skills

Figma From Code Discovery Assets next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Figma From Code Discovery Assets compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Figma From Code Discovery Assets this skillbitovi/ai-enablement-prompts121—~1.4kAutomated safety check: PassMIT
Orchestrate Stageseqra/opentaint163—~806Automated safety check: PassApache-2.0
Security AuditorArchethect/sc-auditor127—~5.9kAutomated safety check: NotesNone
Cherry Studio PR ReviewCherryHQ/cherry-studio52k—~3.9kAutomated safety check: PassAGPL-3.0
Merge ReadyVladSez/easy-invoice-pdf1.1k1 repos~1.4kAutomated safety check: PassAGPL-3.0
Igniteui Wc Choose ComponentsIgniteUI/igniteui-webcomponents170—~4.6kAutomated safety check: PassMIT

Similar skills

  • Orchestrate Stage

    seqra/opentaint

    Run one stage of the OpenTaint pipeline by coordinating leaf subagents and deterministic joins.

    163 GitHub stars~806 tokensUpdated today
    SecurityAuto-check passed
  • Security Auditor

    Archethect/sc-auditor

    Interactive smart contract security audit using Map-Hunt-Attack methodology with static analysis, parallel hunt lanes, skeptic-judge verification, and structured reporting.

    127 GitHub stars~5.9k tokensUpdated 6 mo ago
    SecurityAuto-check: notes
  • Cherry Studio PR Review

    CherryHQ/cherry-studio

    Reviews Cherry Studio branches, pull requests, commits, files and docs against the project's own architecture, naming, API-boundary and UI rules, report-only by default.

    52k GitHub stars~3.9k tokensUpdated today
    DevelopmentAuto-check passed
  • Merge Ready

    VladSez/easy-invoice-pdf

    Take a branch from "code exists (or is about to)" to "ready for Ben's final review" — multi-axis subagent review with verified findings, fixes, ci:check, checkpoint commits, and an updated PR.

    1.1k GitHub starsUsed in 1 repo~1.4k tokens
    Documents & OfficeAuto-check passed
  • Igniteui Wc Choose Components

    IgniteUI/igniteui-webcomponents

    Identify the right Ignite UI Web Components (igniteui-webcomponents, grids, charts, dock manager, React wrappers) for a UI requirement and point to official docs, examples, and API references.

    170 GitHub stars~4.6k tokensUpdated today
    Frontend & DesignAuto-check passed
  • Prescriptive Q&A workflow for designing agentic pipelines, multi-model councils, sub-agent hierarchies, and tool-loop hardening for any domain.

    494 GitHub stars~7.3k tokensUpdated 2 mo ago
    Agent WorkflowsAuto-check passed

More from bitovi/ai-enablement-prompts

All 40 skills in this repo
  • Component Registry

    bitovi/ai-enablement-prompts

    Track reusable UI components and unextracted patterns. An agent skill from bitovi/ai-enablement-prompts.

    121 GitHub stars~597 tokensUpdated 28 days ago
    Auto-check passed
  • Computed Styles

    bitovi/ai-enablement-prompts

    Extract and compare computed CSS styles between a baseline URL and a dev/Storybook URL using Playwright MCP evaluate calls.

    121 GitHub stars~2.4k tokensUpdated 28 days ago
    Auto-check passed
  • Create Plugin

    bitovi/ai-enablement-prompts

    A skill your agent uses when the user asks to "create a plugin", "add a plugin", "make a new plugin", "build a plugin", or wants to package skills into an installable plugin for this marketplace.

    121 GitHub stars~2k tokensUpdated 28 days ago
    Auto-check passed
  • Create React Modlet

    bitovi/ai-enablement-prompts

    Create React components, hooks, or utilities following the modlet pattern.

    121 GitHub stars~2.1k tokensUpdated 28 days ago
    Auto-check passed
  • Create Skill

    bitovi/ai-enablement-prompts

    A skill your agent uses when the user asks to "create a skill", "add a skill", "make a new skill", "build a skill", or wants to automate a repeated workflow into a reusable prompt.

    121 GitHub stars~1.6k tokensUpdated 28 days ago
    Auto-check passed
  • Create Skill

    bitovi/ai-enablement-prompts

    Create new Agent Skills for this project. An agent skill from bitovi/ai-enablement-prompts.

    121 GitHub stars~1.7k tokensUpdated 28 days ago
    Auto-check passed

Works with

Questions about Figma From Code Discovery Assets

What does Figma From Code Discovery Assets do?

Subagent for figma-from-code Phase 0b. An agent skill from bitovi/ai-enablement-prompts. Figma From Code Discovery Assets is an agent skill from bitovi/ai-enablement-prompts. Subagent for figma-from-code Phase 0b.

When should I use Figma From Code Discovery Assets?

Figma From Code Discovery Assets fits situations like: tasks that involve Static analysis and SAST; tasks that involve Subagents.

How do I install Figma From Code Discovery Assets in Claude Code?

Run `npx skills add bitovi/ai-enablement-prompts --skill figma-from-code-discovery-assets -a claude-code`. Or copy the skill folder (plugins/figma-from-code/skills/figma-from-code/2-discovery-assets in bitovi/ai-enablement-prompts) into .claude/skills/figma-from-code-discovery-assets in your project. Claude Code loads it when a task matches its description.

How do I install Figma From Code Discovery Assets in Codex?

Run `npx skills add bitovi/ai-enablement-prompts --skill figma-from-code-discovery-assets -a codex`. Or copy the skill folder (plugins/figma-from-code/skills/figma-from-code/2-discovery-assets in bitovi/ai-enablement-prompts) into .agents/skills/figma-from-code-discovery-assets in your project. Codex loads it when a task matches its description.

Can I use Figma From Code Discovery Assets in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add bitovi/ai-enablement-prompts --skill figma-from-code-discovery-assets -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/figma-from-code-discovery-assets, .gemini/skills/figma-from-code-discovery-assets, .github/skills/figma-from-code-discovery-assets and .opencode/skills/figma-from-code-discovery-assets in your project.

What does Figma From Code Discovery Assets need to run?

Going by SKILL.md and its folder, Figma From Code Discovery Assets needs the command-line tools its instructions call (node).

Does Figma From Code Discovery Assets access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Figma From Code Discovery Assets safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Figma From Code Discovery Assets use?

Figma From Code Discovery Assets is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Figma From Code Discovery Assets use?

About 1.4k tokens (SKILL.md is roughly 5.7k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Figma From Code Discovery Assets?

Skills that share tags, products or a category with Figma From Code Discovery Assets: Orchestrate Stage (seqra/opentaint, 163 stars), Security Auditor (Archethect/sc-auditor, 127 stars), Cherry Studio PR Review (CherryHQ/cherry-studio, 52k stars) and Merge Ready (VladSez/easy-invoice-pdf, 1.1k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Figma From Code Discovery Assets?

bitovi (a GitHub organization) maintains it in bitovi/ai-enablement-prompts, which has 121 GitHub stars. The repository holds 40 skills in this directory. The repository was last updated on September 11, 2026.

Source: bitovi/ai-enablement-prompts on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.