← ClaudeAtlas

ui-auditlisted

Audit UI for design token compliance and component adoption. Static grep-based analysis against the sitemap's page and component files. Requires a design system with semantic tokens.
marcoguillermaz/claude-dev-kit · ★ 3 · Web & Frontend · score 75
Install: claude install-skill marcoguillermaz/claude-dev-kit
## Configuration (fill in before first run) > Replace these placeholders: > - `[SITEMAP_OR_ROUTE_LIST]` - e.g. `docs/sitemap.md`, `docs/routes.md`, `src/router/index.ts` > - `[APP_SOURCE_GLOB]` - fallback if no sitemap: `app/**/page.tsx`, `src/**/*.vue`, `templates/**/*.html` > - `[DYNAMIC_ROUTE_PATTERN]` - pattern for dynamic route segments. Examples: Next.js `/[id]`, SvelteKit `/[id]`, Django `<int:pk>`, Rails `:id`, native: "detail view controllers" > > If `[SITEMAP_OR_ROUTE_LIST]` is not filled, the skill reports an explicit error and exits. > If filled but the file does not exist on disk, the skill falls back to `[APP_SOURCE_GLOB]`. **Critical constraint**: `[SITEMAP_OR_ROUTE_LIST]` is the authoritative inventory of every page file and key component. Read it first and derive the file target list from it. Do NOT run free-form `grep -r` across source directories - scope every check to the files listed in the sitemap. **Scope boundary**: this skill covers design-token compliance and component adoption only. Accessibility (aria, tabindex, focus, labels, axe-core WCAG scan, APCA contrast) lives in `/accessibility-audit` - run it alongside `/ui-audit` for any UI change. Static-only skill - no dev server required. Can run concurrently with browser-based skills per pipeline.md. --- ## Step 0 - Target resolution Parse `$ARGUMENTS` for a `target:` token. | Pattern | Meaning | |---|---| | `target:section:<name>` | Restrict to routes whose path contains `<name>` | | No targe