accessibility-per-comp…
Audit one design system component's accessibility against WCAG 2.2 AA: keyboard, screen reader, contrast, focus, ARIA, target…
Audit Figma variable collections: tier mapping, naming, alias chains, modes, orphans; can fix in place with Figma Console MCP. Triggers: audit my Figma variables, review variable collections, Figma variable health. For token files in code use token-audit.
Claude Code
$ npx -y skills add murphytrueman/design-system-ops --skill figma-variable-audit --agent claude-code
Codex
$ npx skills add murphytrueman/design-system-ops --skill figma-variable-audit -a codex -y
Cursor
$ npx skills add murphytrueman/design-system-ops --skill figma-variable-audit -a cursor -y
Gemini CLI
$ npx skills add murphytrueman/design-system-ops --skill figma-variable-audit -a gemini-cli -y
GitHub Copilot
$ npx skills add murphytrueman/design-system-ops --skill figma-variable-audit -a github-copilot -y
OpenCode
$ npx skills add murphytrueman/design-system-ops --skill figma-variable-audit -a opencode -y
Windsurf
$ npx skills add murphytrueman/design-system-ops --skill figma-variable-audit -a windsurf -y
name: figma-variable-audit description: "Audit Figma variable collections: tier mapping, naming, alias chains, modes, orphans; can fix in place with Figma Console MCP. Triggers: audit my Figma variables, review variable collections, Figma variable health. For token files in code use token-audit." allowed-tools: Read, Write, Grep, Glob, Bash(cat:*), Bash(find:*), Bash(head:*), Bash(ls:*) references: - ../../knowledge-notes/token-architecture.md - ../../knowledge-notes/output-discipline.md
A skill for auditing Figma variable collections against three-tier token architecture principles. Produces a structured report with severity-rated findings and a prioritised remediation list. For teams whose source of truth lives in Figma variables rather than code.
Confirm that every path in this skill's frontmatter `references:` exists relative to this SKILL.md. If any is missing, stop: the install is incomplete, usually because a flattening installer (for example `npx skills install`) dropped the repo-root `knowledge-notes/` directory. Tell the user to reinstall by a method in `1-INSTALL.md` and run `verify-install.sh` from the install root. Proceed without the references only if the user explicitly says to, and then say in the output that it was produced without the pack's reference material.
This skill applies the three-tier token architecture model to Figma variables: primitives encode raw values, semantic variables encode intent, and component-tier variables map intent to specific UI contexts. Figma-native teams treat variables as their token source of truth — this audit reads Figma directly and validates the same structural dimensions as the code-based token-audit: naming conventions, tier separation, alias chains, mode coverage, orphaned variables, and DTCG readiness.
The audit is not about enforcing a particular naming convention. It's about identifying where the variable structure is working against the teams using it.
---
If `.ds-ops-config.yml` exists, follow the configuration-and-recurring knowledge note (`../../knowledge-notes/configuration-and-recurring.md`) for loading, integration fallbacks and recurring runs. This skill reads:
---
This skill needs to read whole variable collections. Before proceeding, check which Figma access is available by attempting a lightweight call (such as `figma_get_status` or listing available Figma tools). Two limits decide what's possible:
A full audit needs the Figma Console MCP (Desktop Bridge plugin), which reads every collection through the Plugin API.
**If the Console MCP is not available:**
1. The user can provide an exported variables JSON file (from a variables-export plugin, or the Variables REST API on an Enterprise plan) — the audit can run against that 2. The user can run the code-based `token-audit` skill instead, which audits token files in the codebase without needing Figma
**If the Console MCP is available, proceed to Step 1.**
---
Ask the user for a Figma file URL, file key, or node ID. Acceptable inputs:
If `.ds-ops-config.yml` specifies `integrations.figma.file_key`, use it automatically without asking.
**Pull Figma data.** `figma_get_variables` returns a ~2K-token summary by default and auto-summarises any full response over about 25K tokens, so a one-call read of a real library audits a truncated view. Read it in pieces: 1. `figma_get_variables` with `format: "summary"` to get the collections, their modes and variable counts. This is the audit's inventory. 2. For each collection, `figma_get_variables` with `format: "filtered"`, `collection: "<name>"`, `resolveAliases: true`, `verbosity: "standard"`, `pageSize: 100`, and `page` from 1 upwards until a page comes back with fewer than 100 variables. Keep the variable ids: findings and Step 10 fixes need them. If a response says it was summarised, halve `pageSize` and re-read that page. 3. For Step 7 (orphans), re-read each collection with `enrich: true`, `include_usage: true` and `include_dependencies: true`; without those flags the data has no consumer information and orphan claims are guesses. 4. `figma_get_styles` for colour, text, effect and grid styles, which are sometimes used instead of or alongside variables.
Component-tier collections are identified by name and alias direction in Step 2, not by reading components. Request confirmation before reading. Once confirmed, connect and pull the data, and record under Scope how many pages each collection took and whether any response was summarised.
---
Identify which variable collections map to which tiers:
**Primitive tier** — raw values, no semantic meaning. Examples: `Primitives`, `Colors`, `Spacing`, `Font Sizes`, `Raw Colors`
**Semantic tier** — intent-driven
Audit one design system component's accessibility against WCAG 2.2 AA: keyboard, screen reader, contrast, focus, ARIA, target…
Adoption report: coverage (what the system provides), reach (teams with access) and adoption (teams shipping with it), design vs…
Write the AGENTS.md that tells coding agents how to use this design system: where things live, sourced rules, how to check work,…
Write a six-section prose description (purpose, props, anti-patterns, composition, accessibility, examples) for a Figma…
Turn existing audit findings into sprint-ready tickets with T-shirt estimates, acceptance criteria, dependencies and phases.…
Write release notes, a migration guide and a team announcement for a design system change that is already decided, scaled to its…
You MUST use this before any creative work - creating features, building components, adding functionality, modifying behavior, or…
Ask which skill or flow fits your situation. A router over the skills in this repo.