Accessibility
Accessibility testing and improvements
playwright-best-practices
by jovermier
Playwright best practices including selectors, wait strategies, accessibility testing, responsive design, and flaky-test prevention. Use when writing or improving Playwright E2E tests.
ink
by georg-unterholzner
Build CLI applications using React. Use when creating terminal UIs, handling keyboard input, or building interactive command-line tools with React components. Supports flexbox layouts, text styling, focus management, and accessibility.
ui-ux
by kieutrongthien
"UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 9 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, mobile app, .html, .tsx, .vue, .svelte. Elements: button, modal, navbar, sidebar, card, table, form, chart. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, responsive, skeuomorphism, flat design. Topics: color palette, accessibility, animation, layout, typography, font pairing, spacing, hover, shadow, gradient. Integrations: shadcn/ui MCP for component search and examples."
accessibility
by pluginagentmarketplace
Master accessibility - WCAG compliance, screen readers, keyboard navigation, inclusive design
ui-library-usage-auditor
by hopeoverture
This skill should be used when reviewing shadcn/ui component usage to ensure accessibility, consistency, and proper patterns. Applies when auditing UI code, checking component patterns, reviewing layout structure, identifying component extraction opportunities, or ensuring design system compliance. Trigger terms include audit UI, review components, check shadcn, accessibility audit, component review, UI patterns, design system compliance, layout review, refactor components, extract component.
testing-next-stack
by hopeoverture
Scaffolds comprehensive testing setup for Next.js applications including Vitest unit tests, React Testing Library component tests, and Playwright E2E flows with accessibility testing via axe-core. This skill should be used when setting up test infrastructure, generating test files, creating test utilities, adding accessibility checks, or configuring testing frameworks for Next.js projects. Trigger terms include setup testing, scaffold tests, vitest, RTL, playwright, e2e tests, component tests, unit tests, accessibility testing, a11y tests, axe-core, test configuration.
tailwind-shadcn-ui-setup
by hopeoverture
This skill should be used when setting up, configuring, or initializing Tailwind CSS (v3 or v4) and shadcn/ui for Next.js 16 App Router projects. Configure dark mode, design tokens, base layout with header/sidebar, accessibility defaults, and generate example components. Includes comprehensive setup automation, theme customization, and production-ready patterns. Use when the user requests "setup Tailwind", "configure shadcn/ui", "add dark mode", "initialize design system", or "setup UI framework" for Next.js projects.
animator
by SebastiaanWouters
Create beautiful, performant, and accessible web animations with Motion One (motion.dev). Use when requests mention Motion One, motion.dev, WAAPI-based animation, UI micro-interactions, scroll-linked motion, staggered reveals, easing/timing tuning, animation performance optimization, or reduced-motion accessibility in vanilla JS/React/Vue apps.
ux-designer
by k1lgor
Use this for designing user interfaces, defining user flows, creating design systems, and ensuring accessibility and usability.
design-web-guidelines
by baotoq
Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "check my site against best practices".
accessibility-compliance
by ma1orek
Implement WCAG 2.2 compliant interfaces with mobile accessibility, inclusive design patterns, and assistive technology support. Use when auditing accessibility, implementing ARIA patterns, building for screen readers, or ensuring inclusive user experiences.
impeccable-audit
by SebastiaanWouters
"Skills-only equivalent of impeccable.style /audit. Perform comprehensive audit of interface quality across accessibility, performance, theming, and responsive design. Generates detailed report of issues with severity ratings and recommendations. Use for frontend and UI design tasks."
jaws-accessibility
by Ambitos-1995
Accessibility engineering skill for web products with JAWS and NVDA testing plus Spain/EU compliance guidance. Use when the task involves WCAG 2.2 implementation, ARIA behavior, keyboard/focus issues, screen-reader regressions, accessibility audits, remediation plans, or legal scope checks for Ley 11/2023, RD 1112/2018, EAA, and EN 301 549.
web-app-designer
by CAPHTECH
"Webアプリの個別画面・コンポーネントのデザインを体系的に行うスキル。デザインプロセス・レイアウト・コンポーネント設計・インタラクション・アクセシビリティなどWebデザインの確立された手法を適用する。デザインシステム全体の構築・運用はdesign-system-builderスキルを使用すること。Use when: 「Webアプリをデザインして」「UIを設計して」「画面をデザインして」「レスポンシブ対応して」「アクセシビリティを改善して」「コンポーネントを設計して」「カラーパレットを決めて」と言われた時。"
tailwind-design-system
by baotoq
Build scalable design systems with Tailwind CSS, design tokens, component libraries, and responsive patterns. Use when creating component libraries, implementing design systems, or standardizing UI patterns.
impeccable-bolder
by SebastiaanWouters
"Skills-only equivalent of impeccable.style /bolder. Amplify safe or boring designs to make them more visually interesting and stimulating. Increases impact while maintaining usability. Use for frontend and UI design tasks."
design-system-builder
by CAPHTECH
"デザインシステムの構築・運用を体系的に行うスキル。ドキュメント（要件定義・ブランドガイドライン）からDesign Tokens・コンポーネント体系・ガバナンスまでを一貫して設計する。思考フレームワーク（Double Diamond・Atomic Design・Design Tokens 3層）の適用、暗黙的デザイン判断の形式知化（DDR/QOC/RFC）、UIインベントリ収集（手動+MCP自動化）を統合する。Use when: 「デザインシステムを構築して」「デザインシステムを設計して」「デザイントークンを定義して」「デザイン原則を策定して」「UIインベントリを作って」「デザインガバナンスを設計して」「デザイン判断を記録して」と言われた時。"
design-ui-ux-pro-max
by baotoq
"UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 9 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, mobile app, .html, .tsx, .vue, .svelte. Elements: button, modal, navbar, sidebar, card, table, form, chart. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, responsive, skeuomorphism, flat design. Topics: color palette, accessibility, animation, layout, typography, font pairing, spacing, hover, shadow, gradient. Integrations: shadcn/ui MCP for component search and examples."
accessibility-expert
by slb2248
Build inclusive interfaces with WCAG compliance and best practices.
mobile-ux-fixer
by mediawave-dev
"Comprehensive mobile UX audit, visual inspection, and auto-fix skill for web projects. Detects and fixes 40+ mobile issues across 10 phases: viewport/layout, scroll/parallax, animations, images, touch/forms, typography, Core Web Vitals, SEO/PWA, accessibility, RTL, and dark mode. Uses Playwright MCP for visual inspection. Use when user says 'fix mobile', 'mobile audit', 'check mobile', 'mobile issues', 'looks broken on phone', 'scroll jump', 'address bar jump', 'parallax mobile', 'mobile test', 'mobile performance', 'core web vitals mobile', 'תקן מובייל', 'בעיות במובייל', 'קופץ בגלילה', 'נראה רע בטלפון', 'בדיקת מובייל', or after deploying and testing on a real device."
impeccable-teach-impeccable
by SebastiaanWouters
"Skills-only equivalent of impeccable.style /teach-impeccable. One-time setup that gathers design context for your project and saves it to your AI config file. Run once to establish persistent design guidelines. Use for frontend and UI design tasks."
accessibility
by ma1orek
Build WCAG 2.1 AA compliant websites with semantic HTML, proper ARIA, focus management, and screen reader support. Includes color contrast (4.5:1 text), keyboard navigation, form labels, and live regions. Use when implementing accessible interfaces, fixing screen reader issues, keyboard navigation, or troubleshooting "focus outline missing", "aria-label required", "insufficient contrast".
SKILL.md: Cognitive Support Skills
by AICincy
If RSS still above threshold after pool + GC intervention: restart uvicorn workers gracefully (SIGHUP).
impeccable-colorize
by SebastiaanWouters
"Skills-only equivalent of impeccable.style /colorize. Add strategic color to features that are too monochromatic or lack visual interest. Makes interfaces more engaging and expressive. Use for frontend and UI design tasks."