A curated, token-efficient web-development skill stack for AI coding agents.
WebDev Pro Skills is an open-source Agent Skills collection designed to give coding agents deep frontend taste, application UX discipline, hardware-accelerated motion, technical SEO, Core Web Vitals optimization, WCAG 2.2 accessibility, full-stack browser testing, and 8-point production release audits. Built on the SKILL.md standard with progressive disclosure to minimize context footprint.
# Install full 8-skill pack into active coding agent:
Modern LLMs are proficient at generating code syntax, but without strict domain guidance they routinely produce generic AI aesthetic tells ("AI slop"), un-accelerated CSS animations causing layout thrashing, inaccessible component markup, broken canonical tags, and superficial unit tests that never verify DOM rendering.
Instead of polluting the agent's context window with dozens of uncoordinated prompt dumps, WebDev Pro Skills packages opinionated professional craftsmanship into 8 cohesive specialist disciplines using a two-tier progressive disclosure architecture.
Each skill operates with clear activation triggers, hard anti-patterns, and modular on-demand reference guides.
Anti-slop frontend craft, brief inference, 3 design dials (variance, motion, density), sans-first typography, and layout diversification.
Application UX intelligence, 4 application states (Loading, Empty, Populated, Error), high-density data tables, and inline form feedback.
Purposeful 60fps web physics, hardware-accelerated transform/opacity transitions, <300ms interaction timing budgets, and reduced motion.
Technical SEO, canonical integrity, robots.txt, XML sitemaps, JSON-LD Schema.org graphs, Core Web Vitals, and AI search readiness.
Core Web Vitals (LCP < 2.5s, INP < 200ms, CLS < 0.1), bundle splitting, React re-render optimization, Server Components, and zero-CLS assets.
Semantic HTML first, 2px visible focus rings, dialog keyboard focus trapping, ARIA discipline, 4.5:1 color contrast, and 44px tap targets.
Full-stack testing with Vitest unit tests, route integration assertions, and Playwright real-browser verification loops before release.
Pre-production 8-point release gate auditing functionality, UI craft, motion, testing, SEO, performance, accessibility, and security.
To prevent context window bloat, each skill maintains a lightweight SKILL.md (< 1,500 tokens) with high-density decision gates and negative constraints. Comprehensive reference guides, spring physics tables, and test fixtures live in modular references/ files loaded strictly on-demand.
| Coding Agent / Platform | Installation Method | Support Status |
|---|---|---|
| Claude Code | npx skills add pokhrelboss/webdev-pro-skills | Native (SKILL.md standard) |
| OpenAI Codex | Direct repo integration / CLI installer | Fully Supported |
| Cursor | .cursor/rules / Agent Skills importer | Supported |
| Google Antigravity | Skills directory plugin configuration | Native |
| Agent Skills Standard | Any tool adhering to SKILL.md specification | Verified Compliant |
How progressive disclosure, opinionated design variance dials, and token-efficient separation of concerns give coding agents superior frontend craftsmanship, technical SEO, and production release verification.