Stats
Actions
Tags
Help us improve
Share bugs, ideas, or general feedback.
From ui-refactor
Review a screenshot, code file, or UI description for design quality using Refactoring UI principles
npx claudepluginhub timbrinded/kiln --plugin ui-refactorHow this command is triggered — by the user, by Claude, or both
Slash command
/ui-refactor:design-review [screenshot-or-code-path] [optional-focus-area]This command is limited to the following tools:
The summary Claude sees in its command listing — used to decide when to auto-load this command
Review the given input for UI design quality using the ui-refactor skill. **Determine the mode from arguments:** - If `$ARGUMENTS` contains an image path (`.png`, `.jpg`, `.jpeg`, `.webp`, `.gif`) → Visual review mode - If `$ARGUMENTS` contains a code file path (`.css`, `.scss`, `.tsx`, `.jsx`, `.vue`, `.svelte`, `.html`) → Code review mode - If `$ARGUMENTS` contains text description → Advisory mode - If no arguments → Prompt the user to provide a screenshot, file path, or description **Optional focus area (second argument):** If the user specifies a focus area (e.g., "typography", "colo...
/design-reviewReviews UI files or components interactively for design, usability, code quality, and performance issues. Configures via sequential questions on focus, context, and platform.
/design-reviewReviews code, screenshots, or visual artifacts against visual design principles, identifies violations with scores, and suggests research-backed fixes.
/critiqueAudits a UI build for design craft across composition, spacing, typography, surfaces, and interaction states, producing a structured critique and rebuild guidance.
/reviewReviews HTML file for design anti-patterns, principles violations, and accessibility issues. Generates markdown report with status tables and recommendations.
/design-reviewAudits a design for quality — accessibility, usability, visual consistency, content, and motion — using HTML files, Figma URLs, preview servers, or screenshots for visual AI critique.
/design-reviewReviews UI files, directories, or staged git changes against design conventions, anti-patterns, accessibility, performance, RTL, i18n, and brand standards. Supports --check, --fix, and --json output.
Share bugs, ideas, or general feedback.
Review the given input for UI design quality using the ui-refactor skill.
Determine the mode from arguments:
$ARGUMENTS contains an image path (.png, .jpg, .jpeg, .webp, .gif) → Visual review mode$ARGUMENTS contains a code file path (.css, .scss, .tsx, .jsx, .vue, .svelte, .html) → Code review mode$ARGUMENTS contains text description → Advisory modeOptional focus area (second argument): If the user specifies a focus area (e.g., "typography", "color", "spacing", "hierarchy", "depth", "polish"), narrow the review to that dimension and load only the relevant reference file.
For visual review (screenshot):
For code review:
For advisory mode (description):
Every issue must include a concrete CSS/Tailwind fix and an explanation of WHY — so the user learns the principle, not just the fix.