New: Earn 20% as an AgentAlley affiliate. Share your link and earn on every sale you refer. Join now New: Earn 20% as an affiliate. Join now

Audit a Figma component library for consistency

Figma Component Audit Skill

by mohitagw15856 · MIT license · ★ 1,395 on GitHub · updated Sep 23

Figma Component Audit Skill cover

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 Codenpx skills add mohitagw15856/pm-claude-skills --skill figma-component-audit -g -a claude-code
Claude 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-audit
Windows (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" -Force
Claude.ai / desktopDownload the ZIP and upload it under Settings → Capabilities → Skills.
Codex, Cursor, other agentsPoint them at SKILL.md. The other files are plain text.

Connects with Agent Alley MCP · agentalley.io/mcp

Files included

  • SKILL.md3.1 KB
Read the files here
mohitagw15856/f6ca7931 file
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---
2name: figma-component-audit
3description: "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 
8Produces 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 
33For 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 
40Naming 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"
View all files on GitHub →

Details

Updated
Sep 23, 2026
License
MIT
Stars on the repo
★ 1,395
Checked
Source
mohitagw15856/pm-claude-skills ↗
Creator
mohitagw15856 · 193 listings
View creator

Made with figma-component-audit

Figma Component Audit Skill — Galaxy 3D — fly through all 1170 skills as a glowing constellation you orbit and click into (from the mohitagw15856/pm-claude-skills README)
Figma Component Audit Skill — Galaxy 3D — fly through all 1170 skills as a glowing constellation you orbit and click into (from the mohitagw15856/pm-claude-skills README)

by mohitagw15856

Figma Component Audit Skill — PM Skills Wrapped — your practice turned into a shareable, Spotify-Wrapped-style story (from the mohitagw15856/pm-claude-skills README)
Figma Component Audit Skill — PM Skills Wrapped — your practice turned into a shareable, Spotify-Wrapped-style story (from the mohitagw15856/pm-claude-skills README)

by mohitagw15856

Similar skills

See all →
SkillDesign, redesign, shape, critique, audit, polish, clarifyImpeccablepbakaus/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 starsSkillApple's approach to interface design and fluidApple designemilkowalski/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 starsSkillBuild an animation from scratchBuilding Animationsemilkowalski/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 starsSkillRenders a component you choose in every stateBreakjakubkrehel/skills · by jakubkrehelRenders a component you choose in every state and scenario on a temporary page and stress tests it.★ 7.1k GitHub starsSkillReviews your work across multiple categories like UIChange reviewjakubkrehel/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 starsSkillCraft-first interface design for dashboards, admin panelsThe ProblemDammyjay93/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 stars

More from mohitagw15856

SkillDesign a 360-degree feedback survey or write a structured360-Degree Feedback Template Skillmohitagw15856/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 starsSkillDesign statistically rigorous A/B tests for product featuresA/B Test Planner Skillmohitagw15856/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 starsSkillGenerate a WCAG 2.2 accessibility audit checklistAccessibility Audit Skillmohitagw15856/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 starsSkillBuild a structured account plan for any key customerAccount Plan Skillmohitagw15856/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 starsSkillOptimize an article for Answer Engine Optimization so AIAEO Optimizer Skillmohitagw15856/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 starsSkillConduct a structured ethical review of an AI or ML featureAI Ethics Review Skillmohitagw15856/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