Frontend Design Plugins in Claude Code: Who Generates, Who Critiques

Pick by the job: generate UI, critique it, or serve your tokens

The frontend work developers most want to hand to Claude Code is the repetitive part — scaffolding components, wiring up design tokens, and catching the accessibility problems a rushed build leaves behind. The Claude Code plugins for frontend design split cleanly along that line: some generate new UI, some critique the UI you already have, and one just feeds your real design tokens to the agent. Knowing which job you're doing tells you which to install.

• Pick ui-ux-pro-max if you're starting a UI from scratch and want tokens, palettes, and framework components generated for you.
• Pick impeccable if you have a working interface that feels off and want concrete code fixes, not a rebuild.
• Pick open-design if you already run a design system and want Claude to reference your actual tokens instead of inventing them.
• Pick taste-skill or frontend-design if the problem is that your output looks templated and you want an opinionated visual direction enforced.

Frontend and design are two of the most-searched themes on the directory — 132 and 163 searches over the last 30 days — but of the 652 plugins that tag frontend, only a handful actually generate or audit UI. These eight are the ones that do.

Frontend design plugins in Claude Code, side by side

Stars and installs come from different populations — a plugin can hold high stars on its source repo but few weekly installs here, and repos that bundle many plugins don't pass their stars down to any single one. Read the number columns as rough signals, not a ranking. The "job" column is what actually separates these.

ui-ux-pro-max: generate tokens, palettes, and components

ui-ux-pro-max generates design tokens, brand assets, and accessible UI components for React, Next.js, Vue, Svelte, and Astro using shadcn/ui and Tailwind, and it ships 161 color palettes and 57 font pairings to pull from. Reach for it at the start of a build, when an empty repo needs a consistent system fast rather than hand-picked components. It sits opposite impeccable: this one creates UI from a prompt, while impeccable only reviews UI that already exists. It's skills-only, so everything runs inside the model with no server to stand up, and it carries the highest star count in this group at 99,489. See ui-ux-pro-max.

impeccable: fix the UI you already shipped

impeccable audits production interfaces — UX reviews, accessibility scans, visual-hierarchy and responsive-behavior checks — and hands back actionable code fixes and design decisions. Use it when a page works but feels wrong and you want targeted repairs instead of regenerating the component. Where ui-ux-pro-max and frontend-design create, impeccable critiques; it's the plugin you run after a build, not before. At 457 installs in the last 7 days it has the most weekly pulls of any plugin here. Details at impeccable.

open-design: serve your real design tokens over MCP

open-design is the only MCP plugin in this set: it exposes your design system's tokens, components, and theme data from a local daemon so the agent references real values in the code it writes. Use it when you already maintain a design system and you're tired of Claude inventing hex codes and spacing. It complements ui-ux-pro-max directly — where that plugin invents a system, open-design grounds generation in the one you already have. It carries 58,045 stars. See open-design.

taste-skill: enforce an anti-generic house style

taste-skill enforces opinionated design patterns — brutalist, minimalist, editorial, and conversion-aware layouts — with strict typography, color, spacing, and motion rules, plus an image-to-code workflow, aimed at React/Next.js and Tailwind. Use it when your builds keep landing on the same templated look and you want a defined standard applied and audited. It overlaps impeccable on design audits, but where impeccable diagnoses a specific interface, taste-skill applies a consistent style across projects. It has 47,958 stars. See taste-skill.

frontend-design: choose a direction before you write components

frontend-design, from Anthropic's frontend-design repo, helps make intentional visual decisions — aesthetic direction, typography, and layout — specifically to avoid templated defaults. Reach for it at the earliest stage, when you're deciding how something should look rather than generating it. Pair it with ui-ux-pro-max: frontend-design sets the direction, ui-ux-pro-max produces the components. It has 98 installs in the last 7 days; its repo hosts 38 plugins, so the repo's star count isn't this plugin's. See frontend-design.

fullstack-dev-skills: frontend as one lane in a full-stack kit

fullstack-dev-skills bundles 66 skills across 12 languages plus frontend and backend frameworks, infrastructure, DevOps, and testing, plus Jira/Confluence commands. Choose it when you want frontend help inside a general toolkit rather than a design specialist — it's breadth, not depth. It's the only plugin here that ships commands alongside skills, and at 9,974 stars and 80 installs/7d it's a smaller, more general pick than the design-focused skills above. See fullstack-dev-skills.

document-skills and pptx: design for docs and decks, not the browser

These two are the honest outliers. document-skills creates Office files — Excel, Word, PowerPoint — plus PDFs, and folds in art/image generation and some frontend UI building; pptx focuses narrowly on generating and editing .pptx slides with curated color palettes and visual motifs. Use them when your "frontend" is a report or a presentation rather than a web app — slide and document design is real design work, just not web UI. Both are skills-only and come from Anthropic repos that bundle several plugins, so repo stars don't map to either one. See document-skills and pptx.

Match the plugin to where your UI actually breaks

The pick changes with the stage of the work. Choosing a look with nothing built yet: frontend-design. Empty repo, need a system generated: ui-ux-pro-max, or open-design if that system already exists and you want it respected. A live interface with accessibility or hierarchy problems: impeccable. Output that keeps looking generic across projects: taste-skill. Frontend work as a side quest in a larger build: fullstack-dev-skills. A deck or a document instead of a screen: document-skills or pptx.

Two of these overlap enough to note: impeccable and taste-skill both audit design, but impeccable fixes a specific interface while taste-skill enforces a repeatable standard — run impeccable on the page in front of you, taste-skill on the project as a whole.

These are skills and MCP plugins, not visual themes; if you're after ready-made color and typography themes instead, browse the /themes category. For a wider look at how skills, commands, hooks, and MCP servers differ, see Claude Code plugin examples by component type, and once the UI is built, our deployment plugins guide covers shipping it. To compare the set yourself, start at ui-ux-pro-max if you're generating and impeccable if you're fixing, or open the plugins directory.