Skip to content
Get packs

Front-End Checklist CLI

Lets an agent review frontend code and live pages against 380+ Front-End Checklist rules.

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

What it does

Once installed, the agent can check frontend files (HTML, CSS, JavaScript, JSX, Vue, Svelte, Astro) and public web pages against a set of about 380 best-practice rules covering accessibility, performance, SEO, security, images, i18n and privacy. It runs the frontendchecklist command-line tool, reads the JSON findings, explains each one and suggests fixes, then re-checks until serious issues are resolved. Most checks are static heuristics that run offline on local files.

Great for

  • Developers who want an AI assistant to catch accessibility, SEO or performance issues before a commit or pull request
  • Teams preparing a site launch who want a structured pre-release pass
  • Anyone who wants an agent to audit a deployed public URL and explain the results

Skip it if

  • Final sign-off on accessibility or legal compliance: the heuristics can miss rendered contrast, focus order and real performance, so a clean result does not prove the code is compliant
  • Private or internal pages behind login: the audit command only fetches public https URLs and the tool may send audit results to the project's dashboard

Try asking

  • “Review the files I changed on this branch for accessibility and SEO issues”
  • “Audit https://example.com and tell me the high-priority problems”
  • “Explain the Front-End Checklist rule for image alt text and show me how to fix it”
  • “Run the launch checklist against this project and list what is still open”
Step-by-step guide: how to use Front-End Checklist CLIInstall, first run, examples, tips and FAQs

Install in 3 steps

  1. 1

    Download the skill

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

    cli.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip cli.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip cli.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

  • Pass only the changed files or use git diff --cached piped into review to keep results focused
  • Use --fail-on high so the agent loops until no critical or high findings remain
  • Treat 'no findings' as 'nothing provable found', and follow up with search and rule for areas the tool cannot check

What's inside

  • package.json
  • README.md
  • scripts/build.ts
  • SKILL.md
  • src/args.ts
  • src/commands/audit.ts
  • src/commands/lookup.ts
  • src/commands/review.ts
  • src/content.ts
  • src/index.ts
  • src/output.ts
  • src/spec.ts
  • tests/cli.test.mjs
  • tsconfig.json

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.