claude-skills

Use when auditing a repository's uncommitted or messy changes and restructuring them into clean, logical commits. Enforces zero AI co-author footers and groups related files by domain.

Converts a structured decisions document into .claude/rules/ files (frontend.md, backend.md, security.md, infra.md). Called by the rules-writer agent after architect or rules-lock interview completes.

Systematic codebase analysis — architecture, tech stack, code patterns, brand guidelines, and provider doc health. Produces a structured Codebase Digest consumed by other agents.

Validates and updates provider docs (CLAUDE.md, GEMINI.md, AGENTS.md, WARP.md) for staleness after task execution. Also updates CHANGELOG.md and TASKS.md checklist.

Token-aware session planning. Takes a list of goals/tasks and produces a prioritized TASKS.md checklist split across sessions based on estimated token usage and complexity.

Prompt the user to save the current agent output as a markdown spec file. Handles y/n prompt, target directory selection, filename generation, and file writing. Use at the end of any agent workflow.

Write an Architecture Decision Record (ADR) documenting a technical decision with context, options considered, and rationale. Use when a significant technical decision needs to be documented.

Design animations for React/Next.js components using Framer Motion (Motion) or GSAP. Covers entrances, scroll-triggered reveals, page transitions, stagger effects, and interactive micro-animations. Respects user motion preferences.

Design a RESTful or GraphQL API with endpoints, schemas, error handling, and versioning strategy. Use when starting a new API or extending an existing one.

Interview the user about their brand guidelines, aesthetics, and design preferences before building any UI. Produces a structured Brand Profile used by all other frontend skills. Always invoke first before design-system-init or component-design.

Decompose an epic or large feature into stories and tasks ready for sprint planning. Produces a structured backlog. Use when given a feature, epic, or milestone to break down.

Generate a structured changelog from git commits, PR titles, or a list of changes. Follows Keep a Changelog format. Use when preparing a release or documenting what changed.

Design and generate a CI/CD pipeline (GitHub Actions, GitLab CI, or generic) with test, build, security scan, and deploy stages. Use when setting up or improving CI/CD for a project.

Review code for correctness, security, performance, and maintainability. Produces a structured review with severity-tagged findings. Use when asked to review a PR, file, or code snippet.

Design a React component from scratch using shadcn/ui primitives + Tailwind CSS + CVA variants. Respects the project's Brand Profile and design tokens. Produces a complete, typed, accessible component.

Design a relational or document database schema with tables, relationships, indexes, and migration plan. Use when designing data models for a new feature or service.

Systematically debug an error, bug, or unexpected behavior. Produces a root cause analysis and fix. Use when given an error message, stack trace, or bug description.

Scan an existing React/Next.js codebase and extract its implicit design system — colors, typography, spacing, component patterns, and inconsistencies. Use when onboarding to an existing project or before formalizing a design system.

Bootstrap a complete design system for a React/Next.js project using shadcn/ui + Tailwind CSS v4. Generates globals.css tokens, tailwind.config, font setup, and a base component theme. Requires a Brand Profile from brand-intake first.

Generate an optimized, secure, production-ready Dockerfile and docker-compose for a given application. Use when containerizing an app or improving an existing Dockerfile.

Estimate task complexity and effort using T-shirt sizes and story points. Produces estimates with confidence levels and risk factors. Use when asked to estimate a task, story, or epic.

Review React/Next.js frontend code for correctness, accessibility, performance, design system adherence, and best practices. Produces a severity-tagged report. Use when reviewing frontend PRs or auditing existing components.

Safely inspects sensitive config files (.env, docker-compose, Dockerfile, YAML, vault configs) and reports their structure without ever exposing secret values. Use when you need to understand what secrets/config a project uses without reading the actual values.

Design a page layout or section layout using modern patterns (bento grid, dashboard, hero, magazine, masonry, etc.) for React/Next.js with Tailwind CSS. Produces complete, copy-paste JSX with layout rationale.

Audit code or system design for performance issues. Identifies bottlenecks, N+1 queries, unnecessary re-renders, and algorithmic inefficiencies. Use when investigating slow code or reviewing for performance.

Plan and scope a new feature with phases, acceptance criteria, and risk assessment. Use when a user describes a feature idea and wants a structured implementation plan.

Refactor code for clarity, maintainability, and reduced complexity without changing behavior. Use when asked to clean up, restructure, or improve existing code.

Audit code for security vulnerabilities (OWASP Top 10, injection, auth issues, secrets exposure). Produces a severity-ranked findings report. Use when asked to security-review code, a PR, or a module.

Write technical documentation — README, guides, runbooks, or onboarding docs. Produces clear, maintainable docs. Use when asked to document a feature, service, or process.

Generate comprehensive test suites for a function, module, or API endpoint. Covers unit, integration, and edge cases. Use when asked to add tests to existing code.