Figma Component Audit
Figma Component Audit Skill
Audit a Figma component library for consistency, coverage gaps, and naming issues. Use when asked to audit components, review a design system, check component consistency, identify missing components, or assess Figma library health.
--- name: figma-component-audit description: "Audit a Figma component library for consistency, coverage gaps, and naming issues. Use when asked to audit components, review a design system, check component consistency, identify missing components, or assess Figma library health. Produces a structured audit report with issues prioritised by impact, naming recommendations, and a fix plan." --- # Figma Component Audit Skill Produces a structured audit of a Figma component library — identifying inconsistencies, naming problems, coverage gaps, and prioritised recommendations. ## Required Inputs - **Component list or description** (paste component names or describe what exists) - **Product type** (mobile app / web app / desktop / multi-platform) - **Design system maturity** (new / growing / mature / legacy) - **Primary concern** (optional) ## Output Structure
Overview
Produces a structured audit of a Figma component library — identifying inconsistencies, naming problems, coverage gaps, and prioritised recommendations.
Manual install (npx, ZIP)
Claude Code
npx skills add mohitagw15856/pm-claude-skills --skill figma-component-audit -g -a claude-codeClaude Code (manual)
mkdir -p ~/.claude/skills && curl -sL https://codeload.github.com/mohitagw15856/pm-claude-skills/tar.gz/f6ca79348c55 \
| tar -xz -C ~/.claude/skills --strip-components=2 pm-claude-skills-f6ca79348c55/skills/figma-component-auditWindows (PowerShell)
New-Item -ItemType Directory -Force "$HOME\.claude\skills" | Out-Null; Invoke-WebRequest "https://m.agentalley.io/zip/524133d1e72b7194a071/figma-component-audit.zip" -OutFile "$env:TEMP\figma-component-audit.zip"; Expand-Archive "$env:TEMP\figma-component-audit.zip" -DestinationPath "$HOME\.claude\skills" -ForceClaude.ai / desktop
Codex, Cursor, other agents
Connects with Agent Alley MCP · agentalley.io/mcp
Files included
SKILL.md3.1 KB
Read the files here
mohitagw15856/
SKILL.md
Show the full text82 lines
Figma Component Audit Skill
Produces a structured audit of a Figma component library — identifying inconsistencies, naming problems, coverage gaps, and prioritised recommendations.
Required Inputs
- Component list or description (paste component names or describe what exists)
- Product type (mobile app / web app / desktop / multi-platform)
- Design system maturity (new / growing / mature / legacy)
- Primary concern (optional)
Output Structure
1. Audit Summary
| Dimension | Status | Score |
|---|---|---|
| Naming consistency | Red/Amber/Green | /10 |
| Component coverage | /10 | |
| Variant completeness | /10 | |
| Documentation | /10 | |
| Overall health | /10 |
Verdict: What is the state of this library and the single most important thing to fix?
2. Naming Issues
For each problem: Issue: [Problem type]
- What is happening: [Specific examples]
- Why it matters: [Impact on designers and developers]
- Fix: [Exact naming convention to adopt]
- Examples: Before / After
Naming convention to enforce:
- Components: PascalCase (NavigationBar)
- Variants: Lowercase with slashes (size/large, state/hover)
- Pages: All caps (COMPONENTS, FOUNDATIONS)
3. Coverage Gaps
| Missing Component | Priority | Why Needed |
|---|---|---|
| [Component] | High/Medium/Low | [Use case] |
4. Variant Completeness Check
| Component | Default | Hover | Active | Disabled | Error | Missing |
|---|---|---|---|---|---|---|
| [Button] | Yes | Yes | No | Yes | No | Active, Error |
5. Prioritised Fix Plan
| # | Fix | Effort | Impact | Do First? |
|---|---|---|---|---|
| 1 | [Fix] | Low/Med/High | High | Yes |
Quality Checks
- Naming recommendations have before/after examples
- Coverage gaps are relevant to the product type
- Fix plan is ordered by impact-to-effort ratio
- Variant completeness covers all interactive states
Anti-Patterns
- Do not flag naming issues without providing a specific, consistent naming convention to adopt
- Do not audit only visual consistency — also check for missing interactive states and accessibility compliance
- Do not list all issues at equal priority — group by impact (Critical / Major / Minor) so the fix plan is actionable
- Do not omit variant completeness — every interactive component must cover all required states
- Do not leave coverage gaps without recommending specific missing components to add
Example Trigger Phrases
- "Audit my Figma component library"
- "Review our design system for consistency issues"
- "What components are we missing in our Figma library?"
- "Our component naming is a mess — help me fix it"
- "Do a health check on our Figma components"
| 1 | |
| 2 | name figma-component-audit |
| 3 | description "Audit a Figma component library for consistency, coverage gaps, and naming issues. Use when asked to audit components, review a design system, check component consistency, identify missing components, or assess Figma library health. Produces a structured audit report with issues prioritised by impact, naming recommendations, and a fix plan." |
| 4 | |
| 5 | |
| 6 | # Figma Component Audit Skill |
| 7 | |
| 8 | Produces a structured audit of a Figma component library — identifying inconsistencies, naming problems, coverage gaps, and prioritised recommendations. |
| 9 | |
| 10 | ## Required Inputs |
| 11 | |
| 12 | **Component list or description** (paste component names or describe what exists) |
| 13 | **Product type** (mobile app / web app / desktop / multi-platform) |
| 14 | **Design system maturity** (new / growing / mature / legacy) |
| 15 | **Primary concern** (optional) |
| 16 | |
| 17 | ## Output Structure |
| 18 | |
| 19 | ### 1. Audit Summary |
| 20 | |
| 21 | | Dimension | Status | Score | |
| 22 | |---|---|---| |
| 23 | | Naming consistency | Red/Amber/Green | /10 | |
| 24 | | Component coverage | | /10 | |
| 25 | | Variant completeness | | /10 | |
| 26 | | Documentation | | /10 | |
| 27 | | Overall health | | /10 | |
| 28 | |
| 29 | **Verdict:** What is the state of this library and the single most important thing to fix? |
| 30 | |
| 31 | ### 2. Naming Issues |
| 32 | |
| 33 | For each problem: |
| 34 | **Issue: [Problem type]** |
| 35 | What is happening: [Specific examples] |
| 36 | Why it matters: [Impact on designers and developers] |
| 37 | Fix: [Exact naming convention to adopt] |
| 38 | Examples: Before / After |
| 39 | |
| 40 | Naming convention to enforce: |
| 41 | Components: PascalCase (NavigationBar) |
| 42 | Variants: Lowercase with slashes (size/large, state/hover) |
| 43 | Pages: All caps (COMPONENTS, FOUNDATIONS) |
| 44 | |
| 45 | ### 3. Coverage Gaps |
| 46 | |
| 47 | | Missing Component | Priority | Why Needed | |
| 48 | |---|---|---| |
| 49 | | [Component] | High/Medium/Low | [Use case] | |
| 50 | |
| 51 | ### 4. Variant Completeness Check |
| 52 | |
| 53 | | Component | Default | Hover | Active | Disabled | Error | Missing | |
| 54 | |---|---|---|---|---|---|---| |
| 55 | | [Button] | Yes | Yes | No | Yes | No | Active, Error | |
| 56 | |
| 57 | ### 5. Prioritised Fix Plan |
| 58 | |
| 59 | | # | Fix | Effort | Impact | Do First? | |
| 60 | |---|---|---|---|---| |
| 61 | | 1 | [Fix] | Low/Med/High | High | Yes | |
| 62 | |
| 63 | ## Quality Checks |
| 64 | [ ] Naming recommendations have before/after examples |
| 65 | [ ] Coverage gaps are relevant to the product type |
| 66 | [ ] Fix plan is ordered by impact-to-effort ratio |
| 67 | [ ] Variant completeness covers all interactive states |
| 68 | |
| 69 | ## Anti-Patterns |
| 70 | |
| 71 | [ ] Do not flag naming issues without providing a specific, consistent naming convention to adopt |
| 72 | [ ] Do not audit only visual consistency — also check for missing interactive states and accessibility compliance |
| 73 | [ ] Do not list all issues at equal priority — group by impact (Critical / Major / Minor) so the fix plan is actionable |
| 74 | [ ] Do not omit variant completeness — every interactive component must cover all required states |
| 75 | [ ] Do not leave coverage gaps without recommending specific missing components to add |
| 76 | |
| 77 | ## Example Trigger Phrases |
| 78 | "Audit my Figma component library" |
| 79 | "Review our design system for consistency issues" |
| 80 | "What components are we missing in our Figma library?" |
| 81 | "Our component naming is a mess — help me fix it" |
| 82 | "Do a health check on our Figma components" |
Details
- Updated
- Sep 23, 2026
- License
- MIT
- Stars on the repo
- ★ 1,395
- Checked
- Source
- mohitagw15856/pm-claude-skills ↗
- Creator
- mohitagw15856 · 191 listings
Similar skills
See all →
SkillInterface Designer
pbakaus/impeccable · by pbakausUse when the user wants to design, redesign, shape, critique, audit, polish, clarify, distill, harden, optimize, adapt, animate, colorize, extract, or otherwise improve a frontend interface. Covers websites, landing pages, dashboards, product UI, app shells, components, forms, settings, onboarding, and empty states. Handles UX review, visual hierarchy, information architecture, cognitive load, accessibility, performance, responsive behavior, theming, anti-patterns, typography, fonts, spacing, layout, alignment, color, motion, micro-interactions, UX copy, error states, edge cases, i18n, and reusable design systems or tokens. Also use for bland designs that need to become bolder or more delightful, loud designs that should become quieter, live browser iteration on UI elements, or ambitious visual effects that should feel technically extraordinary. Not for backend-only or non-UI tasks.★ 70.4k GitHub stars
SkillApple Design Patterns
emilkowalski/skills · by emilkowalskiApple's approach to interface design and fluid, physical motion, translated for the web. Use when building or reviewing gesture-driven UI, spring animations, drag/swipe/sheet interactions, momentum and interruptible transitions, translucent materials and depth, typography (optical sizing, tracking, leading), reduced-motion, or the design foundations (feedback, spatial consistency, restraint) behind Apple-style interfaces.★ 40.8k GitHub stars
SkillWeb Animation Choreographeremilkowalski/skills · by emilkowalskiBuild an animation from scratch, making the decisions in the order that determines whether it feels right — should it animate at all, what purpose, which tool, which properties, which curve and duration, how it interrupts, how it exits. Writes the implementation. Use when asked to animate something, add motion, make a component feel alive, or build a transition. For critiquing existing motion use review-animations; for auditing a whole codebase use improve-animations.★ 40.8k GitHub stars
SkillComponent State Renderer
jakubkrehel/skills · by jakubkrehelRenders a component you choose in every state and scenario on a temporary page and stress tests it.★ 7.1k GitHub stars
SkillDesign Quality Auditorjakubkrehel/skills · by jakubkrehelReviews your work across multiple categories like UI, typography, layout, color, writing and accessibility and gives you a detailed analysis of the findings.★ 7.1k GitHub stars
SkillDashboard Interface Design
Dammyjay93/interface-design · by Dammyjay93Craft-first interface design for dashboards, admin panels, SaaS apps, tools, settings pages, data interfaces, and interactive products. Use when designing, building, reviewing, auditing, or refining product UI where visual craft, layout hierarchy, tokens, states, visual direction, or design-system consistency matter. Not for marketing pages, landing pages, campaigns, or brand-only work.★ 5.8k GitHub starsMore from mohitagw15856
Skill360 Feedback Survey
mohitagw15856/pm-claude-skills · by mohitagw15856Design a 360-degree feedback survey or write a structured 360 feedback report. Use when asked to build a 360 feedback process, write 360 feedback for a colleague, design a feedback survey, or produce a feedback report. Produces either a complete survey instrument with rating scales and open-ended questions, or a structured narrative feedback report with themes, strengths, and development areas.★ 1.4k GitHub stars
SkillExperiment Design Plannermohitagw15856/pm-claude-skills · by mohitagw15856Design statistically rigorous A/B tests for product features, UI changes, onboarding flows, and pricing experiments. Use when asked to set up an experiment, design an A/B test, calculate sample size, or interpret test results. Produces a complete test plan with hypothesis, variant definitions, sample size, duration estimate, guardrail metrics, and a results interpretation guide.★ 1.4k GitHub stars
SkillWeb Accessibility Auditormohitagw15856/pm-claude-skills · by mohitagw15856Generate a WCAG 2.2 accessibility audit checklist and remediation suggestions for any UI or design. Use when asked to audit for accessibility, check WCAG compliance, review a design for a11y issues, or create an accessibility remediation plan. Produces a prioritised checklist with pass/fail assessments and specific fixes.★ 1.4k GitHub stars
SkillKey Account Plannermohitagw15856/pm-claude-skills · by mohitagw15856Build a structured account plan for any key customer or target account. Use when asked to create an account plan, key account strategy, strategic account review, or territory plan. Produces a complete account plan with relationship map, growth opportunities, risks, and 90-day action plan.★ 1.4k GitHub stars
SkillAEO Optimizermohitagw15856/pm-claude-skills · by mohitagw15856Optimize an article for Answer Engine Optimization (AEO) so AI engines like ChatGPT, Perplexity, and Claude can extract, quote, and cite it. Use when asked to AEO-optimize, make content AI-readable, improve AI citation chances, or adapt an article for answer engines. Produces an AEO-optimised rewrite with question headings, 50–80 word answer capsules, a paragraph-length audit, and flagged trust signals.★ 1.4k GitHub stars
SkillAI Ethics Review Conductormohitagw15856/pm-claude-skills · by mohitagw15856Conduct a structured ethical review of an AI or ML feature, model, or product. Use when preparing to deploy an AI system, assessing algorithmic risk, auditing a model for bias, or producing a responsible AI impact assessment. Produces a structured ethics review covering fairness, transparency, privacy, safety, accountability, and societal impact with a risk tier score, pre-deployment checklist, and prioritised mitigations.★ 1.4k GitHub stars