Stats
Actions
Tags
From sage
Universal web development principles — accessibility (WCAG 2.2), performance (Core Web Vitals), security headers (OWASP), SEO, responsive design, error UX, and loading states. Framework-agnostic.
How this skill is triggered — by the user, by Claude, or both
Slash command
/sage:webThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
**Layer 1 — Domain Foundation (v2.0)**
Layer 1 — Domain Foundation (v2.0)
Universal web development principles that apply to every web project regardless of framework. React, Vue, Svelte, vanilla JS — these principles hold.
This pack encodes the foundational web platform knowledge that agents frequently get right in isolation but miss in practice. An agent knows what ARIA labels are. It still produces a form with no error announcements for screen readers. An agent knows about Core Web Vitals. It still renders a 2MB hero image without dimensions.
The gap isn't knowledge — it's consistent application.
| Type | Count | Coverage |
|---|---|---|
| Patterns | 7 | Accessibility (WCAG 2.2), performance (Core Web Vitals), security headers (OWASP), SEO, responsive design, error UX, loading states |
| Anti-patterns | 6 | Div soup, missing alt text, layout shift, unprotected forms, client-only critical paths, no security headers |
| Constitution | 7 | principles |
Grounded in: W3C WCAG 2.2 (October 2023), Google Core Web Vitals (2025), OWASP Secure Headers Project, OWASP CSP Cheat Sheet, MDN Web Docs, Web Almanac 2025, European Accessibility Act (June 2025).
react, nextjs, etc.)api or baas)npx claudepluginhub xoai/sage --plugin sageAudits UI code against 100+ web interface guidelines from Vercel covering accessibility, forms, dark mode, typography, animation, images, performance, navigation, touch, and internationalization.
Optimizes website and web app performance by measuring Core Web Vitals with Lighthouse, analyzing bundle sizes and bottlenecks, and implementing caching, code splitting, and asset optimizations.