Claude Code Frontend Skills
Automate your frontend workflow with purpose-built Claude Code slash commands.
Claude Code Frontend Skills is a collection of AI-powered skills that bring structured commenting, accessibility auditing, code review, and refactoring directly into your editor. Using simple slash commands with optional arguments, you stay in control of what gets analyzed, fixed, or rewritten, without leaving your workflow. Compatible with JavaScript, TypeScript, React, CSS, Sass, HTML, Vue, Svelte, and Astro, it covers a wide range of the frontend stack.
git clone https://github.com/Effeilo/claude-code-frontend-skills.git
Skill for Claude Code
See the CHANGELOG
The Claude Code Frontend Skills collection
-
Front Review
Catch real issues before they reach production, directly from Claude Code.
Front-review is a Claude Code skill that analyses frontend files for code quality, potential bugs, performance, and maintainability. Using a single slash command with an optional strict mode, you get a structured report where every issue comes with a line reference, a clear problem statement, and a concrete fix. Compatible with JavaScript, TypeScript, React, CSS, Sass, HTML, Vue, Svelte, and Astro, it covers a wide range of the frontend stack.
-
Front Refactor
Modernize your frontend code without touching its behavior, directly from Claude Code.
Front-refactor is a Claude Code skill that rewrites frontend files with improved naming, simplified logic, dead code removal, and modern syntax. Using a single slash command, preview mode analyses the file and outputs a structured diff of all proposed changes, apply mode rewrites it. Compatible with JavaScript, TypeScript, React, CSS, Sass, Vue, Svelte, and Astro, it covers a wide range of the frontend stack.
-
Front Comments
Document your frontend code with structured, consistent comments, directly from Claude Code.
Front-comments is a Claude Code skill that adds structured comments to frontend files at two levels: Level 1 for file headers, section dividers, and JSDoc headings on every significant block, Full for everything in Level 1 plus inline comments on every function body, directive, and template expression. Using a single slash command with optional arguments, you control the depth and language of the output. Compatible with JavaScript, TypeScript, React, CSS, Sass, HTML, Vue, Svelte, and Astro, it covers a wide range of the frontend stack.
-
Front A11y
Audit and fix accessibility issues against WCAG 2.1 AA, directly from Claude Code.
Front-a11y is a Claude Code skill that analyses frontend files for accessibility violations across images, forms, interactive elements, ARIA usage, keyboard navigation, and semantic structure. Using a single slash command, audit mode produces a structured report grouped by severity, fix mode applies all automatically-fixable issues directly to the file and lists what requires manual attention. Compatible with HTML, React, Vue, Svelte, and Astro, it covers the most widely used frontend templating languages.