{"id":"98bea175-4655-459e-8448-ba05383085b6","shortId":"uE9zTu","kind":"skill","title":"fixing-accessibility","tagline":"Audit and fix HTML accessibility issues including ARIA labels, keyboard navigation, focus management, color contrast, and form errors. Use when adding interactive controls, forms, dialogs, or reviewing WCAG compliance.","description":"# fixing-accessibility\n\nFix accessibility issues.\n\n## how to use\n\n- `/fixing-accessibility`\n  Apply these constraints to any UI work in this conversation.\n\n- `/fixing-accessibility <file>`\n  Review the file against all rules below and report:\n  - violations (quote the exact line or snippet)\n  - why it matters (one short sentence)\n  - a concrete fix (code-level suggestion)\n\nDo not rewrite large parts of the UI. Prefer minimal, targeted fixes.\n\n## When to Use\nReference these guidelines when:\n- adding or changing buttons, links, inputs, menus, dialogs, tabs, dropdowns\n- building forms, validation, error states, helper text\n- implementing keyboard shortcuts or custom interactions\n- working on focus states, focus trapping, or modal behavior\n- rendering icon-only controls\n- adding hover-only interactions or hidden content\n\n## rule categories by priority\n\n| priority | category | impact |\n|----------|----------|--------|\n| 1 | accessible names | critical |\n| 2 | keyboard access | critical |\n| 3 | focus and dialogs | critical |\n| 4 | semantics | high |\n| 5 | forms and errors | high |\n| 6 | announcements | medium-high |\n| 7 | contrast and states | medium |\n| 8 | media and motion | low-medium |\n| 9 | tool boundaries | critical |\n\n## quick reference\n\n### 1. accessible names (critical)\n\n- every interactive control must have an accessible name\n- icon-only buttons must have aria-label or aria-labelledby\n- every input, select, and textarea must be labeled\n- links must have meaningful text (no “click here”)\n- decorative icons must be aria-hidden\n\n### 2. keyboard access (critical)\n\n- do not use div or span as buttons without full keyboard support\n- all interactive elements must be reachable by Tab\n- focus must be visible for keyboard users\n- do not use tabindex greater than 0\n- Escape must close dialogs or overlays when applicable\n\n### 3. focus and dialogs (critical)\n\n- modals must trap focus while open\n- restore focus to the trigger on close\n- set initial focus inside dialogs\n- opening a dialog should not scroll the page unexpectedly\n\n### 4. semantics (high)\n\n- prefer native elements (button, a, input) over role-based hacks\n- if a role is used, required aria attributes must be present\n- lists must use ul or ol with li\n- do not skip heading levels\n- tables must use th for headers when applicable\n\n### 5. forms and errors (high)\n\n- errors must be linked to fields using aria-describedby\n- required fields must be announced\n- invalid fields must set aria-invalid\n- helper text must be associated with inputs\n- disabled submit actions must explain why\n\n### 6. announcements (medium-high)\n\n- critical form errors should use aria-live\n- loading states should use aria-busy or status text\n- toasts must not be the only way to convey critical information\n- expandable controls must use aria-expanded and aria-controls\n\n### 7. contrast and states (medium)\n\n- ensure sufficient contrast for text and icons\n- hover-only interactions must have keyboard equivalents\n- disabled states must not rely on color alone\n- do not remove focus outlines without a visible replacement\n\n### 8. media and motion (low-medium)\n\n- images must have correct alt text (meaningful or empty)\n- videos with speech should provide captions when relevant\n- respect prefers-reduced-motion for non-essential motion\n- avoid autoplaying media with sound\n\n### 9. tool boundaries (critical)\n\n- prefer minimal changes, do not refactor unrelated code\n- do not add aria when native semantics already solve the problem\n- do not migrate UI libraries unless requested\n\n## common fixes\n\n```html\n<!-- icon-only button: add aria-label -->\n<!-- before --> <button><svg>...</svg></button>\n<!-- after -->  <button aria-label=\"Close\"><svg aria-hidden=\"true\">...</svg></button>\n\n<!-- div as button: use native element -->\n<!-- before --> <div onclick=\"save()\">Save</div>\n<!-- after -->  <button onclick=\"save()\">Save</button>\n\n<!-- form error: link with aria-describedby -->\n<!-- before --> <input id=\"email\" /> <span>Invalid email</span>\n<!-- after -->  <input id=\"email\" aria-describedby=\"email-err\" aria-invalid=\"true\" /> <span id=\"email-err\">Invalid email</span>\n```\n\n## review guidance\n\n- fix critical issues first (names, keyboard, focus, tool boundaries)\n- prefer native HTML before adding aria\n- quote the exact snippet, state the failure, propose a small fix\n- for complex widgets (menu, dialog, combobox), prefer established accessible primitives over custom behavior\n\n## Limitations\n- Use this skill only when the task clearly matches the scope described above.\n- Do not treat the output as a substitute for environment-specific validation, testing, or expert review.\n- Stop and ask for clarification if required inputs, permissions, safety boundaries, or success criteria are missing.","tags":["fixing","accessibility","antigravity","awesome","skills","sickn33","agent-skills","agentic-skills","ai-agent-skills","ai-agents","ai-coding","ai-workflows"],"capabilities":["skill","source-sickn33","skill-fixing-accessibility","topic-agent-skills","topic-agentic-skills","topic-ai-agent-skills","topic-ai-agents","topic-ai-coding","topic-ai-workflows","topic-antigravity","topic-antigravity-skills","topic-claude-code","topic-claude-code-skills","topic-codex-cli","topic-codex-skills"],"categories":["antigravity-awesome-skills"],"synonyms":[],"warnings":[],"endpointUrl":"https://skills.sh/sickn33/antigravity-awesome-skills/fixing-accessibility","protocol":"skill","transport":"skills-sh","auth":{"type":"none","details":{"cli":"npx skills add sickn33/antigravity-awesome-skills","source_repo":"https://github.com/sickn33/antigravity-awesome-skills","install_from":"skills.sh"}},"qualityScore":"0.700","qualityRationale":"deterministic score 0.70 from registry signals: · indexed on github topic:agent-skills · 34793 github stars · SKILL.md body (4,762 chars)","verified":false,"liveness":"unknown","lastLivenessCheck":null,"agentReviews":{"count":0,"score_avg":null,"cost_usd_avg":null,"success_rate":null,"latency_p50_ms":null,"narrative_summary":null,"summary_updated_at":null},"enrichmentModel":"deterministic:skill-github:v1","enrichmentVersion":1,"enrichedAt":"2026-04-24T00:50:57.166Z","embedding":null,"createdAt":"2026-04-18T21:37:18.463Z","updatedAt":"2026-04-24T00:50:57.166Z","lastSeenAt":"2026-04-24T00:50:57.166Z","tsv":"'/fixing-accessibility':42,53 '0':283 '1':154,198 '2':158,246 '3':162,292 '4':167,324 '5':170,370 '6':175,410 '7':180,455 '8':185,492 '9':192,531 'access':3,8,35,37,155,160,199,208,248,606 'action':406 'ad':24,102,139,585 'add':545 'alon':482 'alreadi':550 'alt':503 'announc':176,389,411 'appli':43 'applic':291,369 'aria':11,217,221,244,344,383,395,421,428,449,453,546,586 'aria-busi':427 'aria-control':452 'aria-describedbi':382 'aria-expand':448 'aria-hidden':243 'aria-invalid':394 'aria-l':420 'aria-label':216 'aria-labelledbi':220 'ask':644 'associ':401 'attribut':345 'audit':4 'autoplay':527 'avoid':526 'base':336 'behavior':133,610 'boundari':194,533,580,652 'build':112 'busi':429 'button':105,213,257,330 'caption':513 'categori':148,152 'chang':104,537 'clarif':646 'clear':619 'click':237 'close':286,309 'code':80,542 'code-level':79 'color':17,481 'combobox':603 'common':561 'complex':599 'complianc':32 'concret':77 'constraint':45 'content':146 'contrast':18,181,456,462 'control':26,138,204,445,454 'convers':52 'convey':441 'correct':502 'criteria':655 'critic':157,161,166,195,201,249,296,415,442,534,573 'custom':123,609 'decor':239 'describ':623 'describedbi':384 'dialog':28,109,165,287,295,314,317,602 'disabl':404,475 'div':253 'dropdown':111 'element':264,329 'email':567,569 'empti':507 'ensur':460 'environ':635 'environment-specif':634 'equival':474 'error':21,115,173,373,375,417 'escap':284 'essenti':524 'establish':605 'everi':202,223 'exact':66,589 'expand':444,450 'expert':640 'explain':408 'failur':593 'field':380,386,391 'file':56 'first':575 'fix':2,6,34,36,78,94,562,572,597 'fixing-access':1,33 'focus':15,127,129,163,270,293,300,304,312,486,578 'form':20,27,113,171,371,416 'full':259 'greater':281 'guidanc':571 'guidelin':100 'hack':337 'head':360 'header':367 'helper':117,397 'hidden':145,245 'high':169,174,179,326,374,414 'hover':141,468 'hover-on':140,467 'html':7,563,583 'icon':136,211,240,466 'icon-on':135,210 'imag':499 'impact':153 'implement':119 'includ':10 'inform':443 'initi':311 'input':107,224,332,403,649 'insid':313 'interact':25,124,143,203,263,470 'invalid':390,396,566,568 'issu':9,38,574 'keyboard':13,120,159,247,260,275,473,577 'label':12,218,230 'labelledbi':222 'larg':86 'level':81,361 'li':356 'librari':558 'limit':611 'line':67 'link':106,231,378 'list':349 'live':422 'load':423 'low':190,497 'low-medium':189,496 'manag':16 'match':620 'matter':72 'meaning':234,505 'media':186,493,528 'medium':178,184,191,413,459,498 'medium-high':177,412 'menu':601 'menus':108 'migrat':556 'minim':92,536 'miss':657 'modal':132,297 'motion':188,495,520,525 'must':205,214,228,232,241,265,271,285,298,346,350,363,376,387,392,399,407,434,446,471,477,500 'name':156,200,209,576 'nativ':328,548,582 'navig':14 'non':523 'non-essenti':522 'ol':354 'one':73 'open':302,315 'outlin':487 'output':629 'overlay':289 'page':322 'part':87 'permiss':650 'prefer':91,327,518,535,581,604 'prefers-reduced-mot':517 'present':348 'primit':607 'prioriti':150,151 'problem':553 'propos':594 'provid':512 'quick':196 'quot':64,587 'reachabl':267 'reduc':519 'refactor':540 'refer':98,197 'relev':515 'reli':479 'remov':485 'render':134 'replac':491 'report':62 'request':560 'requir':343,385,648 'respect':516 'restor':303 'review':30,54,570,641 'rewrit':85 'role':335,340 'role-bas':334 'rule':59,147 'safeti':651 'save':564,565 'scope':622 'scroll':320 'select':225 'semant':168,325,549 'sentenc':75 'set':310,393 'short':74 'shortcut':121 'skill':614 'skill-fixing-accessibility' 'skip':359 'small':596 'snippet':69,590 'solv':551 'sound':530 'source-sickn33' 'span':255 'specif':636 'speech':510 'state':116,128,183,424,458,476,591 'status':431 'stop':642 'submit':405 'substitut':632 'success':654 'suffici':461 'suggest':82 'support':261 'tab':110,269 'tabindex':280 'tabl':362 'target':93 'task':618 'test':638 'text':118,235,398,432,464,504 'textarea':227 'th':365 'toast':433 'tool':193,532,579 'topic-agent-skills' 'topic-agentic-skills' 'topic-ai-agent-skills' 'topic-ai-agents' 'topic-ai-coding' 'topic-ai-workflows' 'topic-antigravity' 'topic-antigravity-skills' 'topic-claude-code' 'topic-claude-code-skills' 'topic-codex-cli' 'topic-codex-skills' 'trap':130,299 'treat':627 'trigger':307 'ui':48,90,557 'ul':352 'unexpect':323 'unless':559 'unrel':541 'use':22,41,97,252,279,342,351,364,381,419,426,447,612 'user':276 'valid':114,637 'video':508 'violat':63 'visibl':273,490 'way':439 'wcag':31 'widget':600 'without':258,488 'work':49,125","prices":[{"id":"78d1341d-3269-48ac-a472-f78b1f324569","listingId":"98bea175-4655-459e-8448-ba05383085b6","amountUsd":"0","unit":"free","nativeCurrency":null,"nativeAmount":null,"chain":null,"payTo":null,"paymentMethod":"skill-free","isPrimary":true,"details":{"org":"sickn33","category":"antigravity-awesome-skills","install_from":"skills.sh"},"createdAt":"2026-04-18T21:37:18.463Z"}],"sources":[{"listingId":"98bea175-4655-459e-8448-ba05383085b6","source":"github","sourceId":"sickn33/antigravity-awesome-skills/fixing-accessibility","sourceUrl":"https://github.com/sickn33/antigravity-awesome-skills/tree/main/skills/fixing-accessibility","isPrimary":false,"firstSeenAt":"2026-04-18T21:37:18.463Z","lastSeenAt":"2026-04-24T00:50:57.166Z"}],"details":{"listingId":"98bea175-4655-459e-8448-ba05383085b6","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"sickn33","slug":"fixing-accessibility","github":{"repo":"sickn33/antigravity-awesome-skills","stars":34793,"topics":["agent-skills","agentic-skills","ai-agent-skills","ai-agents","ai-coding","ai-workflows","antigravity","antigravity-skills","claude-code","claude-code-skills","codex-cli","codex-skills","cursor","cursor-skills","developer-tools","gemini-cli","gemini-skills","kiro","mcp","skill-library"],"license":"mit","html_url":"https://github.com/sickn33/antigravity-awesome-skills","pushed_at":"2026-04-24T00:28:59Z","description":"Installable GitHub library of 1,400+ agentic skills for Claude Code, Cursor, Codex CLI, Gemini CLI, Antigravity, and more. Includes installer CLI, bundles, workflows, and official/community skill collections.","skill_md_sha":"ba5f238beb10311e31101095e24d104e45a9852e","skill_md_path":"skills/fixing-accessibility/SKILL.md","default_branch":"main","skill_tree_url":"https://github.com/sickn33/antigravity-awesome-skills/tree/main/skills/fixing-accessibility"},"layout":"multi","source":"github","category":"antigravity-awesome-skills","frontmatter":{"name":"fixing-accessibility","description":"Audit and fix HTML accessibility issues including ARIA labels, keyboard navigation, focus management, color contrast, and form errors. Use when adding interactive controls, forms, dialogs, or reviewing WCAG compliance."},"skills_sh_url":"https://skills.sh/sickn33/antigravity-awesome-skills/fixing-accessibility"},"updatedAt":"2026-04-24T00:50:57.166Z"}}