Menu
Run Lighthouse audits (a11y, SEO, best practices) across all pages for desktop and mobile, then record results in docs/lighthouse/audit/.
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
Based on SOC occupation classification
The pols.dev anti-slop design law — a comprehensive catalog of generic "AI slop" UI patterns to avoid (glowy pill buttons, gradient heroes, kitchen-sink cards, default font pairings, botched glass/shadows/glows, slop layouts) and what premium craft looks like instead. Use EVERY time you design, build, restyle, or review any user interface, landing page, or visual component — read it before starting, and re-check the output against it before calling the work done.
Unified animation and motion skill — Apple-style fluid interface design, Emil Kowalski's craft standards, and an animation vocabulary glossary. Use when designing, building, or reviewing any animation, transition, gesture, or motion effect. Covers springs, easing, gestures, interruptibility, performance, accessibility, and a reverse-lookup glossary for naming effects.
Use when finishing a feature, fixing a bug, before committing React code, or when the user types `/doctor`, asks to scan, triage, or clean up React diagnostics. Covers lint, accessibility, bundle size, architecture. Includes a regression check and a full local-triage workflow that fetches the canonical playbook.
On-demand repo-wide audit with the best available model — hunts what deterministic gates cannot (architecture drift vs ADRs, security posture, dependency strategy, doc staleness/DX) and routes outcomes into existing rails (ADR/AGENTS.md via aegis-share, or a plan doc in docs/superpowers/specs/). Use when the user asks for a repo audit, health check, or "what should we improve"; not scheduled, not CI-run.
Unified pre-commit review of the uncommitted diff — a finder agent hunts across all lenses (bugs + AGENTS.md rules), then a separate verifier agent adversarially refutes each finding, and its completion stamps the commit gate (ADR-0009/0011/0015). Run before every commit, or whenever the uncommitted diff needs a full review. Pass "high" for a deeper multi-lens verify pass.
Explicit entry point for ticket-granularity work (implement a component, fix a non-trivial bug, refactor a module, add a feature). The user invokes /start-workflow at the start of such tasks. The skill enforces an orchestration sequence — clarify → aegis → plan → optionally ADR → implement (parent by default, delegate by context impact) → fresh-context review → commit/PR — so the work follows the project's rules-driven standards. Skip for one-line fixes, config tweaks, docs-only changes, and trivial typo fixes — handle those directly.
| name | lighthouse-audit |
| description | Run Lighthouse audits (a11y, SEO, best practices) across all pages for desktop and mobile, then record results in docs/lighthouse/audit/. |
| when_to_use | When the user asks for accessibility audit, a11y check, SEO audit, Lighthouse audit, or wants to verify UI quality after changes. |
| argument-hint | [page-path (optional)] |
| arguments | path |
Run Lighthouse audits across the application and record results.
!git log --oneline -1
Confirm the dev server is running on the framework's default port. If the port is occupied, kill the existing process with lsof -ti:<port> | xargs kill before starting. Do not fall back to a different port.
If $path is provided, audit only that page (both desktop and mobile).
Otherwise, discover all navigable pages by:
Classify each as:
For parameterized routes, pick the first available item.
For each target page:
mcp__chrome-devtools__navigate_pagemcp__chrome-devtools__lighthouse_audit with mode: "navigation" for:
device: "desktop"device: "mobile"Create/update docs/lighthouse/audit/YYYY-MM-DD.md:
# Lighthouse Audit Report — YYYY-MM-DD
Commit: `{short hash}` {commit message}
## Summary
| Page | Device | Accessibility | SEO | Best Practices |
|------|--------|--------------|-----|----------------|
| ... | Desktop | ... | ... | ... |
| ... | Mobile | ... | ... | ... |
## Violations
### {Page} ({Device})
#### Accessibility
- **{rule-id}**: {description} — {count} elements
- Impact: {critical/serious/moderate/minor}
- Fix: {suggestion}
#### SEO
- **{rule-id}**: {description}
- Fix: {suggestion}
#### Best Practices
- **{rule-id}**: {description}
- Fix: {suggestion}
(If a category has no violations, write "No issues found.")
If a previous report exists in docs/lighthouse/audit/, compare scores. Note regressions (score dropped by 5+) or improvements under ## Changes from previous audit.