Front-End Checklist — Claude Code MCP server: review and install
Connect an MCP server that checks frontend code and public pages against quality rules. Use it to review components or audit accessibility, SEO, and performance.
claude mcp add --transport http front-end-checklist https://mcp.frontendchecklist.ioWhat Front-End Checklist does
Front-End Checklist gives MCP agents tools to review HTML, CSS, JavaScript, React, and Next.js. Its corpus contains 386 rules in 11 categories. An agent can search rules, retrieve remediation guidance, or run a focused audit.
Use review_code for pasted code and audit_url for a public https:// page. You can also look up an individual rule or request a workflow for an audit. The URL audit is for public HTTPS pages, so it won’t check a local development address.
What it helps with
- review a React component against frontend rules
- find accessibility issues on a public page
- audit a page for SEO and performance problems
- look up a rule and get remediation guidance
Example prompts for the agent
- Use the Front-End Checklist MCP to review this React component and list the clearest findings first.
- Audit the public page
https://example.comfor accessibility and SEO issues. - Find the canonical URL rule and suggest a code fix.
How to install Front-End Checklist
Platform CLI: remote server
claude mcp add --transport http front-end-checklist https://mcp.frontendchecklist.ioPlatform CLI: remote server
codex mcp add mcp --url https://mcp.frontendchecklist.ioConfig file
{
"mcpServers": {
"mcp": {
"url": "https://mcp.frontendchecklist.io"
}
}
}Config file
{
"servers": {
"mcp": {
"type": "http",
"url": "https://mcp.frontendchecklist.io"
}
}
}Platform CLI: remote server
gemini mcp add -t http mcp https://mcp.frontendchecklist.ioStep by step, with commands for each platform: How to add an MCP server to Claude Code, Codex, Cursor, VS Code, Gemini CLI and more
Questions about Front-End Checklist
How do I install Front-End Checklist in Claude Code?
Run claude mcp add --transport http front-end-checklist https://mcp.frontendchecklist.io to connect the server over HTTP.
What does Front-End Checklist do?
It gives an MCP agent tools to review frontend code and public pages against quality rules, search the rule set, and retrieve guidance for fixes.
Can it audit a page from its URL?
Yes. Use audit_url with a public https:// page.
