无障碍
无障碍测试与改进
kanpeki
fellipeutaka
"Use Kanpeki component library in React projects. Activate when user wants to add, use, customize, or compose accessible UI components from Kanpeki (@kanpeki/*). Covers installation, component patterns, forms, theming, and dark mode with React Aria Components + Tailwind CSS 4.1 + CVA."
coder-frontend-design
OzeroHAX
Frontend design system practices: tokens, typography, color, layout, and component consistency.
testing-a11y
OzeroHAX
Accessibility testing (WCAG, keyboard, screen reader)
focus-states
dylantarre
Generates accessible focus indicators meeting WCAG 2.4.7 and 2.4.11 requirements. Use when styling :focus-visible, keyboard navigation indicators, or fixing focus ring visibility issues.
component-docs
dylantarre
Generates component API documentation with props tables, usage examples, and guidelines. Use when documenting component libraries, creating API references, or building component documentation for designers and developers.
aria-patterns
dylantarre
Provides ARIA roles, states, and properties for interactive components. Use when building custom widgets, fixing screen reader issues, or implementing modals, tabs, accordions, menus, or dialogs accessibly.
getting-started
dylantarre
Introduction to the design system skills plugin. Use when first installing the plugin, exploring available skills, or planning a design system implementation.
icon-system
dylantarre
Implements scalable icon systems with SVG sprites or React/Vue components. Use when setting up icon libraries, creating icon sizing tokens, optimizing SVGs, or building accessible icon buttons.
wp-theme-dev
wpacademy
Develop WordPress themes following official WordPress coding standards, theme review requirements, accessibility standards (WCAG 2.1 AA), and modern web development best practices. Use this skill whenever the user wants to create, scaffold, or develop a WordPress theme — including block (FSE) themes, classic themes, child themes, or hybrid themes. Also trigger when the user mentions "WordPress theme", "WP theme", "block theme", "FSE theme", "theme.json", "template parts", "style variations", "child theme", or wants to build a custom design/layout for WordPress. Even if the user just says "build me a theme for X" or "I need a theme", use this skill.
wp-plugin-review
wpacademy
Comprehensive WordPress plugin review covering security vulnerabilities, WordPress Coding Standards (WPCS) compliance, plugin repository guidelines, unit test coverage, and accessibility. Runs automated tools (PHPCS with WPCS, PHPStan, PHPUnit) plus deep manual code review. Outputs a detailed Markdown review report with issues, severity ratings, and actionable fixes. Use this skill whenever the user asks to "review a plugin", "audit a WordPress plugin", "check plugin security", "check plugin for repository submission", "review plugin code", "plugin code review", "check my plugin", or any request involving evaluating a WordPress plugin's code quality, security posture, or repository readiness. Also trigger when a user uploads a plugin zip or folder and asks for feedback, analysis, or a review.
accessibility
KreerC
Quality assurance for web accessibility and usability, particularly for users with disabilities. Use when involved in any web project.
faion-accessibility-specialist
faionfaion
"Accessibility: WCAG compliance, assistive technologies, inclusive design."
faion-frontend-developer
faionfaion
"Frontend: Tailwind, CSS-in-JS, design tokens, UI libraries, PWA, accessibility."
legal
Tyler-R-Kendrick
Use when identifying legal, regulatory, and compliance considerations that affect software companies operating globally. Covers data privacy, intellectual property, open-source licensing, AI regulation, accessibility, export controls, financial regulation, healthcare, cybersecurity compliance, and more. USE FOR: legal risk identification, regulatory compliance overview, jurisdiction mapping, legal topic discovery, risk and compliance consultation triggers, understanding which laws apply to software products DO NOT USE FOR: actual legal advice (consult a licensed attorney), drafting legal documents, specific legal interpretation for your situation
testing
Tyler-R-Kendrick
Use when choosing a testing strategy, right-sizing test coverage, or understanding test categories. Covers the Test Trophy model, test type tradeoffs, and guidance on balancing static analysis, unit, integration, and end-to-end tests. USE FOR: testing strategy, Test Trophy, test type selection, right-sizing test coverage, balancing test categories, choosing testing tools, test automation architecture DO NOT USE FOR: specific test category implementation (use static-analysis, unit-testing, integration-testing, e2e-testing, etc.), BDD specification authoring (use specs/documentation/gherkin)
web-design-guidelines
ocrbase-hq
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-advocate
dylantarre
Use when designing inclusive animations, addressing vestibular disorders and motion sensitivity, or ensuring animation accessibility compliance.
UI/UX Design Review
rknall
"Comprehensive design review for websites and desktop applications with extensive accessibility analysis. Use this skill when users ask you to review UI/UX designs, wireframes, mockups, prototypes, or deployed interfaces for usability, accessibility (WCAG compliance), visual design, interaction patterns, responsive design, and best practices for web and desktop applications."
Web Design Builder
rknall
"Create and refactor HTML5/JavaScript web designs from specifications or descriptions. Generates complete, accessible, responsive web designs with modern frameworks. Automatically verifies designs using Playwright MCP for accessibility and functionality testing. Use this skill when users ask to create web designs, mockups, landing pages, web applications, or refactor existing HTML/CSS/JS designs."
browser-pilot
Dev-GOM
Chrome DevTools Protocol (CDP) browser automation, web scraping, crawling. 브라우저 자동화, 웹 스크래핑, 크롤링. Features/기능: screenshot with region control 영역지정스크린샷, viewport control 뷰포트제어, PDF generation PDF생성, web scraping 웹스크래핑, data extraction 데이터추출, form filling 폼작성, login automation 로그인자동화, click/input 클릭/입력, element finder 요소찾기, tab management 탭관리, cookie control 쿠키제어, JavaScript execution JS실행, page navigation 페이지이동, wait for element 요소대기, scroll 스크롤, accessibility tree 접근성트리, console messages 콘솔메시지, network idle 네트워크대기, back/forward 뒤로/앞으로, reload 새로고침, file upload 파일업로드, React compatibility React호환성, Smart Mode with Interaction Map 스마트모드. Selectors 셀렉터: CSS selectors (ID, class, attribute), XPath selectors with wildcard * (text-based, structural), XPath indexing (select N-th element with same text). Smart Mode: text-based element search with automatic selector generation. Bot detection bypass 봇감지우회 (navigator.webdriver=false). Auto Chrome connection 자동크롬연결. Headless/headed mode. Daemon-based architecture 데몬기반. Interaction Map System 인터랙션맵. React/framework compatibility React/프레임워크호환성.
accessible-motion
dylantarre
Use when implementing reduced motion alternatives, vestibular-safe animations, WCAG compliance, or designing for users with motion sensitivity.
browser-use
yoloshii
Agentic browser automation with persistent sessions and ARIA snapshot-based navigation. Use when user needs to browse websites, interact with web pages, fill forms, login to sites, warm up social accounts, bypass anti-bot protection, take screenshots, execute JavaScript on pages, manage cookies, handle multi-tab workflows, extract page content as Markdown, search page text, find elements by role or text, upload files, download files, use WebMCP structured tools on Chrome 146+ pages, or perform any multi-step browser task. Three stealth tiers (Playwright, Patchright, Camoufox) with auto-escalation for anti-bot, session persistence with cookie/storage profiles, element ref system, WebMCP tool discovery, new-element detection between snapshots, action loop detection with escalating warnings, auto popup dismissal, download handling, click-by-coordinate fallback, context compaction for long sessions, idle session GC, and per-session locking.
ui-ux-designer
nahisaho
Copilot agent that assists with user interface and experience design, wireframes, prototypes, design systems, and usability testing Trigger terms: UI design, UX design, wireframe, mockup, prototype, user interface, user experience, design system, component library, accessibility, responsive design Use when: User requests involve ui ux designer tasks.
frontend-accessibility-best-practices
sergiodxa
Accessibility (a11y) best practices for React components. Use when creating UI components, forms, interactive elements, or reviewing code for accessibility compliance.