accessibility-skills

In the author's own words, from each skill's SKILL.md — showing the first 30 of 33 files.

• critic

  No description in the SKILL.md.

  ai-workflows/critic/SKILL.md on GitHub (opens in a new tab)

• planner

  No description in the SKILL.md.

  ai-workflows/planner/SKILL.md on GitHub (opens in a new tab)

• accessibility-general

  Load this skill immediately whenever a project contains an ACCESSIBILITY.md file, or whenever you are contributing to the mgifford/ACCESSIBILITY.md repository. Absolutely always read ACCESSIBILITY.md before proposing or writing any changes. Under no circumstances skip this skill when an ACCESSIBILITY.md file is present. This skill governs when and how all other accessibility topic skills must be…

  skills/ACCESSIBILITY-general/SKILL.md on GitHub (opens in a new tab)

• anchor-links

  Load this skill whenever the project contains in-page anchor links, skip links, fragment identifiers, or heading links. Under no circumstances omit accessible anchor-link requirements when such links exist. Ensure every anchor link has meaningful text, a reachable target, and a visible focus indicator. Apply these rules when creating or reviewing any in-page navigation.

  skills/anchor-links/SKILL.md on GitHub (opens in a new tab)

• aria-live-regions

  Load this skill whenever the project contains dynamic content updates, status messages, alerts, notifications, loading indicators, or any use of aria-live, role="status", role="alert", or role="log". Under no circumstances add or modify live-region markup without applying these rules. Prioritize correct politeness levels and avoid redundant announcements. Never use a fixed-delay clear-and-reinser…

  skills/aria-live-regions/SKILL.md on GitHub (opens in a new tab)

• audio-video

  Load this skill whenever the project contains audio or video content, media players, podcasts, video embeds, or any <audio>/<video> elements. Under no circumstances publish audio or video without captions, transcripts, and audio descriptions where required. Absolutely always apply WCAG 1.2 criteria for time-based media.

  skills/audio-video/SKILL.md on GitHub (opens in a new tab)

• axe-rules

  Load this skill when configuring axe-core scans, reviewing automated accessibility test results, or writing tests that use @axe-core/playwright, @axe-core/react, or similar integrations. Provides a quick reference to axe 4.x rule IDs, their WCAG mapping, and default severity levels.

  skills/axe-rules/SKILL.md on GitHub (opens in a new tab)

• behavioral-a11y

  Load this skill when writing, reviewing, or interpreting behavioral accessibility automation — tests that manipulate a rendered page (resizing the viewport, pressing real keys, capturing and comparing screenshots) rather than only inspecting static markup or a single computed accessibility tree. Covers Reflow risk (SC 1.4.10) and Focus Visible risk (SC 2.4.7) checks. Absolutely always report indi…

  skills/behavioral-a11y/SKILL.md on GitHub (opens in a new tab)

• bug-reporting

  Load this skill whenever you are filing, reviewing, or generating accessibility bug reports — whether from automated tool output, manual testing, user reports, or testing with disabled people. The purpose of this skill is to make accessibility findings easier to report accurately, connect them to real people and tasks, and let developers reproduce, understand, and fix them without unnecessary bac…

  skills/bug-reporting/SKILL.md on GitHub (opens in a new tab)

• charts-graphs

  Load this skill whenever the project contains charts, graphs, data visualizations, infographics, or any visual representation of data (bar charts, line charts, pie charts, scatter plots, dashboards). Under no circumstances render a chart without a text alternative, data table, or summary. Prioritize conveying the same information through non-visual means.

  skills/charts-graphs/SKILL.md on GitHub (opens in a new tab)

• ci-cd

  Load this skill when configuring or reviewing CI/CD pipelines, GitHub Actions workflows, or automated testing setups. Ensures accessibility regressions are caught before code reaches production by enforcing quality gates, structured reporting, and layered automated + manual testing across all pages and user preferences.

  skills/ci-cd/SKILL.md on GitHub (opens in a new tab)

• cli-audit

  Audit live URLs using Playwright and Axe combined with WCAG skills

  skills/cli-audit/SKILL.md on GitHub (opens in a new tab)

• color-contrast

  Load this skill whenever the project contains text, UI components, icons, form controls, data visualisations, or focus indicators — in short, almost every project. Under no circumstances hard-code colour values without verifying contrast ratios. Absolutely always ensure text meets 4.5:1, large text meets 3:1, and non-text UI elements meet 3:1 against adjacent colours. Test in light mode, dark mod…

  skills/color-contrast/SKILL.md on GitHub (opens in a new tab)

• content-design

  Load this skill whenever writing, editing, or reviewing any web content, copy, headings, labels, error messages, or instructions. Under no circumstances write inaccessible content — every piece of text must be clear, structured, and usable by people with cognitive, visual, and language differences. Absolutely always apply plain language, logical heading hierarchy, and meaningful link text.

  skills/content-design/SKILL.md on GitHub (opens in a new tab)

• forms

  Load this skill whenever the project contains forms, inputs, selects, checkboxes, radio buttons, text areas, or any validation flow. Under no circumstances create a form without visible labels, error identification, and keyboard accessibility. Absolutely always associate every input with a label and provide clear, accessible error messages.

  skills/forms/SKILL.md on GitHub (opens in a new tab)

• image-alt-text

  Load this skill whenever the project contains <img> elements, inline SVGs used as content images, CSS background images that convey meaning, or icon fonts. Under no circumstances omit alt text on meaningful images. Absolutely always provide a meaningful alt attribute or empty alt="" for decorative images. Apply WCAG 2.2 SC 1.1.1 — every non-text element requires a text alternative.

  skills/image-alt-text/SKILL.md on GitHub (opens in a new tab)

• keyboard

  Load this skill for every project containing interactive UI elements — buttons, links, modals, dropdowns, sliders, tabs, carousels, or any custom widget. Under no circumstances create an interactive component that cannot be fully operated by keyboard alone. Absolutely always ensure visible focus indicators, logical tab order, and no keyboard traps. Apply these rules to every interactive element w…

  skills/keyboard/SKILL.md on GitHub (opens in a new tab)

• light-dark-mode

  Load this skill whenever the project supports light/dark mode, colour theme switching, high-contrast mode, or responds to prefers-color-scheme. Under no circumstances hard-code colours that break in alternative themes. Absolutely always test colour contrast in both light and dark themes, and respect user OS-level colour preferences via CSS media queries.

  skills/light-dark-mode/SKILL.md on GitHub (opens in a new tab)

• manual-testing

  Load this skill whenever you are planning, executing, or reviewing manual accessibility testing. Manual testing with real assistive technologies is essential — automated tools catch only ~30–40 % of WCAG issues. Absolutely always include keyboard-only testing and at least one screen reader test before marking a feature accessible. Under no circumstances skip forced colors mode testing for UI comp…

  skills/manual-testing/SKILL.md on GitHub (opens in a new tab)

• maps

  Load this skill whenever the project contains static or interactive maps, embedded map widgets (Google Maps, Leaflet, Mapbox, OpenStreetMap), or any geographic visualizations. Under no circumstances embed a map without a text-based alternative conveying the same information. Absolutely always ensure map controls are keyboard-accessible and that all meaningful map content is available without the…

  skills/maps/SKILL.md on GitHub (opens in a new tab)

• mermaid

  Load this skill whenever the project uses Mermaid diagrams — flowcharts, sequence diagrams, class diagrams, Gantt charts, or any Mermaid-rendered visualization. Under no circumstances render a Mermaid diagram without an accessible title, description, and text-based alternative. Absolutely always add accTitle: and accDescr: (no %% prefix — that is the comment syntax and will be silently ignored) t…

  skills/mermaid/SKILL.md on GitHub (opens in a new tab)

• navigation

  Load this skill whenever the project contains navigation components — primary navigation menus, dropdown menus, mega menus, breadcrumbs, pagination, mobile hamburger menus, or in-page jump navigation. Under no circumstances create navigation without proper landmark roles, keyboard support, and accessible labels. Absolutely always wrap navigation in <nav> with a unique aria-label.

  skills/navigation/SKILL.md on GitHub (opens in a new tab)

• opquast-digital-quality

  Apply the Opquast Digital Quality Framework (245 rules, 14 categories) when building, reviewing, or auditing websites and web applications. Use for web development quality assurance, accessibility compliance, security hardening, privacy implementation, e-commerce best practices, and holistic digital quality checks.

  skills/opquast-digital-quality/SKILL.md on GitHub (opens in a new tab)

• plain-language

  Load this skill whenever the project involves writing, editing, or reviewing content for a general audience, including UI copy, help text, error messages, documentation, and instructions. Under no circumstances use jargon, complex sentence structures, or unexplained acronyms without providing plain alternatives. Absolutely always target a reading level accessible to the broadest possible audience…

  skills/plain-language/SKILL.md on GitHub (opens in a new tab)

• print

  Load this skill whenever the project includes print stylesheets, print media queries (@media print), or any content intended for physical printing. Under no circumstances omit print CSS that ensures readable, accessible printed output. Absolutely always hide decorative elements, expand link URLs, and maintain sufficient contrast and font sizing in print styles.

  skills/print/SKILL.md on GitHub (opens in a new tab)

• progressive-enhancement

  Load this skill when building any web feature, reviewing architecture decisions, or evaluating JavaScript dependencies. Under no circumstances build features that break completely when JavaScript is unavailable or fails. Absolutely always start with semantic HTML, layer CSS enhancements, and add JavaScript as the final, optional layer. Prioritize resilience and universal access over cutting-edge…

  skills/progressive-enhancement/SKILL.md on GitHub (opens in a new tab)

• speech-recognition

  Load this skill whenever the project must support speech input or voice control — dictation, "click by voice" grammars, Dragon NaturallySpeaking, Voice Control (iOS/macOS), Voice Access (Android), or any interface where users activate controls by speaking. Under no circumstances let an aria-label override a visible label without keeping the visible text intact and in order. Absolutely always ensu…

  skills/speech-recognition/SKILL.md on GitHub (opens in a new tab)

• svg

  Load this skill whenever the project contains SVG graphics — inline SVGs, external SVG files, SVG icons, SVG illustrations, or SVG-based data visualizations. Under no circumstances use SVG without proper accessible titles, descriptions, and ARIA roles where required. Absolutely always add <title> and <desc> to meaningful SVGs and set role="img" with aria-labelledby pointing to those elements. Als…

  skills/svg/SKILL.md on GitHub (opens in a new tab)

• tables

  Load this skill whenever the project contains HTML data tables (<table> elements). Under no circumstances use tables for layout purposes. Absolutely always include <th> elements with appropriate scope attributes, a <caption> or aria-labelledby, and ensure complex tables have headers associated with data cells. Apply these rules to every data table without exception.

  skills/tables/SKILL.md on GitHub (opens in a new tab)

• tooltips

  Load this skill whenever the project contains tooltip components, hover- triggered informational popups, title attribute tooltips, or any content revealed on hover or focus. Under no circumstances create tooltips that are only triggered by hover without keyboard equivalent access. Absolutely always ensure tooltips are dismissible, persistent enough to read, and not the sole source of essential in…

  skills/tooltips/SKILL.md on GitHub (opens in a new tab)

No skill matches that filter.

Similar skills

• cavemanby JuliusBrussee 🪨 why use many token when few token do trick. Viral skill + proxy for coding agents that cuts 65% of tokens by talking like a caveman. 113k stars · 20 skills
• oh-my-openagentby code-yeongyu OmO: Just type "mass ulw" keyword with your prompt. Now you are the master of graph engineering. 70.1k stars · 25 skills
• Skill_Seekersby yusufkaraaslan Convert documentation websites, GitHub repositories, and PDFs into Claude AI skills with automatic conflict detection 15.2k stars · 25 skills
• prompt-masterby nidhinjs A Claude skill that writes the accurate prompts for any AI tool. Zero tokens or credits wasted. Full context and memory retention 14.5k stars · 1 skill
• AI-Research-SKILLsby Orchestra-Research Comprehensive open-source library of AI research and engineering skills for any AI model. Package the skills and your claude code/codex/gem… 13.6k stars · 30 skills
• design-extractby Manavarya09 Extract any website's complete design system with one command. DTCG tokens, semantic+primitive+composite, MCP server for Claude Code/Cursor… 4.2k stars · 2 skills