Skip to content
Get packs

File Upload Accessibility Review

Checks file upload markup for labels, accepted types, progress feedback and keyboard access

Source Download skill
Repository
thedaviddias/Front-End-Checklist
Stars
74,632
Licence
MIT
Files
2 files

What it does

When installed, the agent reviews templates, rendered HTML and shared components for file upload controls and flags accessibility problems, such as unlabeled file inputs, drag-and-drop zones that keyboard users cannot reach, and missing feedback for upload progress and errors. It can also suggest fixes using visible labels, accept attributes and ARIA live regions. The skill is a written checklist of guidance rather than a tool that tests a live site.

Great for

  • Front-end developers reviewing forms that accept file uploads
  • Accessibility reviewers auditing rendered HTML before release
  • Teams maintaining shared upload components or templates

Skip it if

  • Testing a live website with a screen reader or automated scanner, since the skill only reads the files and markup it is given (it does not run an accessibility tool)
  • Projects where the upload markup is generated by a framework and the agent cannot see the rendered output, because the skill asks for the final browser-facing HTML to be checked

Try asking

  • “Review this upload form template and flag any file inputs without associated labels”
  • “Check our shared dropzone component for keyboard accessibility problems”
  • “Explain what accept attributes and size limit text an upload field should show”
  • “Suggest ARIA live region feedback for upload progress and error messages in this HTML”
Step-by-step guide: how to use File Upload Accessibility ReviewInstall, first run, examples, tips and FAQs

Install in 3 steps

  1. 1

    Download the skill

    The ZIP contains the 2 original files, the MIT licence and an attribution note.

    file-upload-accessibility.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip file-upload-accessibility.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip file-upload-accessibility.zip -d .claude/skills/

    Claude apps (web/desktop): Settings → Capabilities → Skills → Upload skill, and choose the ZIP.

  3. 3

    Ask for the task

    No special command needed — the agent reads the skill's description and loads it when your request matches. Try one of the prompts above.

Get better results

  • Paste or point the agent to the rendered HTML output, not only the framework source, so it checks what browsers actually receive.
  • Ask for exact elements and attributes in the report so fixes are easy to locate.
  • Combine the review with a manual keyboard and screen reader test, since reading markup cannot confirm the real experience.

What's inside

  • references/rule.md
  • SKILL.md

Redistributed unmodified from thedaviddias/Front-End-Checklist under the MIT licence. The assessment was drafted with AI from the skill's files on 2026-10-29. Skills can instruct your agent to run code — read SKILL.md and any scripts before installing.