takazudo/fig-url-refer
skills/fig-url-refer/SKILL.md
Read a Figma design node directly from a share URL via the Figma REST API — no Dev Mode subscription, no MCP, no desktop app. Renders the node to PNG and dumps its full style/layout JSON so the design can be described, compared, or implemented. Use whenever the user gives a Figma design URL (figma.com/design/... or /file/...) and wants to see, read, inspect, reference, or implement that node — including `/fig-url-refer <url>`. This is the URL-based counterpart to `/figrefer` (which needs a Dev-plan desktop MCP); prefer this one when the input is a URL rather than a live desktop selection.
$ install --global
skillsauthnpx skillsauth add takazudo/claude-resources fig-url-referInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: Jul 10, 2026, 5:47 AM110.0s2 files scanned
SKILL.md
- name:
- fig-url-refer
- description:
- Read a Figma design node directly from a share URL via the Figma REST API — no Dev Mode subscription, no MCP, no desktop app. Renders the node to PNG and dumps its full style/layout JSON so the design can be described, compared, or implemented. Use whenever the user gives a Figma design URL (figma.com/design/... or /file/...) and wants to see, read, inspect, reference, or implement that node — including `/fig-url-refer <url>`. This is the URL-based counterpart to `/figrefer` (which needs a Dev-plan desktop MCP); prefer this one when the input is a URL rather than a live desktop selection.
- argument-hint:
- <figma-url>
fig-url-refer
Read one Figma node from its share URL using the REST API. The REST API only checks file access (not seat type), so a free Figma account can read any file it can open — this works without a Dev-mode subscription.
Prerequisite: token
A Figma personal access token in FIGMA_API_TOKEN. The script finds it from the environment, or by reading $HOME/.zshenv / .zshrc / .zshrc.local / .zprofile, or via interactive zsh — so a token exported in any of those "just works" even though this script runs in a non-interactive shell.
If the script reports the token is missing, tell the user to add one:
- Figma → Settings → Security → Personal access tokens → generate (scope: File content, read-only)
- Add
export FIGMA_API_TOKEN=figd_...to$HOME/.zshrc(or.zshrc.local)
Step 1: Fetch the node
Run the script with the URL. Pass --out-dir pointing at the session scratchpad so artifacts stay out of the repo:
python3 "$HOME/.claude/skills/fig-url-refer/scripts/fig-fetch.py" "<figma-url>" --out-dir "<scratchpad-dir>"
Options: --scale N (PNG resolution, default 2), --format svg (vector instead of PNG). The URL must contain a node-id — that's present when the user copies a link to a selected layer. The script converts the URL's node-id hyphen form (12671-1784) to the API's colon form automatically.
It prints:
IMG: <path to rendered png/svg>
JSON: <path to full node json>
name / type / size / children
Step 2: Look at the design
Read the IMG: path — that's the visual reference. For exact values (colors, fonts, spacing, radii, text content), read the JSON: file, or grep it when it's large:
fills/strokes→ colors,characters→ text content,styleorfontName/fontSize/fontWeight→ typographyitemSpacing/padding*/layoutMode→ auto-layout spacing,cornerRadius→ radii,effects→ shadows/blur
Step 3: Do what the user asked
Summarize what the node looks like (visual + key styles + structure), then act on the request — commonly:
- implement it → write code in the current project's stack (adapt colors/spacing/type from the JSON; don't copy any framework the design tool would suggest)
- describe / extract tokens → report the concrete style values
- compare with my code → read the relevant project files and diff against the design
With no explicit instruction, present what you see and ask what they'd like to do.
Related Skills
takazudo/finalize-codex-work
tools
VerifiedTrustedCommunity
Acceptance gate for a branch produced by an OpenAI Codex CLI run — usually Codex implementing a /big-plan epic that was handed off to it. Codex reports the work 'done' (or the user flags it WIP with corrections); this skill confirms the branch actually fulfils the original spec, fixes what falls short, and routes larger discoveries into GitHub issues. Use when: (1) User says '/finalize-codex-work', 'finalize codex work', 'confirm the codex work', 'check the codex branch', or 'codex said it's done', (2) A branch is the result of a Codex CLI session and needs verification against its spec issue/PR, (3) After assigning a /big-plan epic to Codex CLI. Pass -m/--merge to run /pr-complete -c at the end.
11SKILL.mdUpdated Jul 10, 2026
takazudo/dev-codex-sync-settings-from-claude
tools
VerifiedTrustedCommunity
Sync the user's Claude Code workflow skills into the OpenAI Codex CLI settings repo ($HOME/.codex) as Codex-native ports, fix the Codex .gitignore for new local state, then commit and push. Use when: (1) user says '/dev-codex-sync-settings-from-claude', 'sync codex settings', 'sync claude skills to codex', 'port skills to codex', or 'update codex from claude'; (2) after updating ~/.claude workflow skills (big-plan, x, x-as-pr, x-wt-teams) and Codex should catch up; (3) the $HOME/.codex repo has drifted behind $HOME/.claude. The ports are condensed Codex-native REWRITES, never file copies.
11SKILL.mdUpdated Jul 10, 2026
takazudo/video-reader
development
VerifiedTrustedCommunity
Analyze a video file (mov, mp4, webm, etc.) or a YouTube video by extracting still frames with ffmpeg and reading them chronologically with vision — Claude cannot ingest video files directly. Use whenever the user provides a video file path or YouTube URL and wants to know what happens in it: "read this video", "watch this video", "check this recording", "what happens in this .mov/.mp4", analyzing a screen recording of a UI bug, or verifying UI behavior captured in a video, even if they don't name this skill.
11SKILL.mdUpdated Jul 7, 2026
takazudo/delay
tools
VerifiedTrustedCommunity
Schedule instructions to run ONCE at a later time in the current session, via a one-shot in-session cron job (CronCreate with recurring: false). Use when: (1) User invokes /delay, (2) User says 'in N hours/minutes do X', 'schedule X for later', 'do this at 16:30', 'remind me in an hour to X', or any other one-shot delayed-execution request. NOT for recurring intervals (use /loop) and NOT for schedules that must survive closing the terminal (use a cloud Routine — the Claude Code Remote `create_trigger` / `send_later` MCP tools, which persist server-side). This skill only schedules — it never executes the instructions immediately.
11SKILL.mdUpdated Jul 7, 2026