Ten Tools to Fix Claude Code's Terrible Design Aesthetic

There's a term circulating among developers using AI coding assistants: "AI slop." You know it when you see it—purple gradients, Inter font plastered everywhere, identical card layouts that could have been generated by the same tired template. It's the visual equivalent of that slightly off smell in AI-generated prose, the tell that signals "a machine made this and nobody cared enough to intervene."

Claude Code, Anthropic's coding assistant, has a specific weakness here. Despite its capabilities in logic and functionality, its design output defaults to a narrow aesthetic band that makes every site look like a B-tier SaaS landing page. Chase AI, a developer and educator in the AI coding space, has compiled ten tools attempting to address this problem. Some are incremental improvements. Others represent genuinely different approaches to how we might teach AI systems about design.

What's interesting isn't whether these tools "solve" AI design—they don't—but what they reveal about the gap between code generation and taste.

Teaching LLMs What Not to Do

The first tool Chase demonstrates is Impeccable, a skill that takes an unusual approach: it explicitly teaches language models to recognize bad design patterns. Rather than saying "make it look good," it shows the AI specific anti-patterns—those side tab accent borders, sparklines, glassmorphism effects—and labels them as what they are.

"This skill uses anti-patterns," Chase explains. "It essentially teaches large language models what AI slop actually looks like."

Impeccable includes 18 different commands addressing everything from UX error messages to responsive design across platforms. It even offers a Chrome extension that highlights AI slop aesthetics directly on your webpage. The approach is dense—scrolling through the skill reveals multiple references for each design domain—but that density might be the point. Vague aesthetic guidance produces vague results.

The tool has only been available for about a month, but it represents a shift from aspirational design prompts ("make it modern and clean") to concrete negative examples. Whether that's enough remains an open question.

Reverse Engineering as Template Generation

SkillUI takes a different tack entirely: it reverse engineers existing websites and converts them into Claude-ready skills. Point it at Stripe's homepage, for instance, and it analyzes the design system—not just the HTML, but scroll interactions and hover states using Playwright—then generates a template you can apply to your own projects.

Chase tested it by pointing the tool at Stripe and requesting "a fake Stripe website in that sort of style." The result, he notes, isn't perfect—custom graphics can't be replicated from a prompt alone—but it captures something of Stripe's visual DNA. "I do like the colors it used. I like sort of the graphic it put here. Like this is honestly really good for me just saying, 'Hey, look at Stripe's website. Build me a foundation.'"

The tool was less than 24 hours old when Chase recorded his video, with seven GitHub stars. That's early-stage enough that anyone using it can legitimately claim hipster status. But the underlying concept—learning design by example rather than by rule—is worth noting. Instead of teaching principles of good design, you're essentially saying: "See this thing people already decided looks good? Do something like that."

It's derivative by definition, but derivative with intention might beat random generation.

The Outlier: WebGPU Skills

Most tools on Chase's list address conventional web design problems—typography, layouts, component libraries. The WebGPU skill is different. It teaches Claude Code to write code that interacts with your graphics card, enabling the kind of advanced animations and visual effects you see on high-end portfolio sites.

Chase is candid about this being outside his usual wheelhouse, but he's clearly intrigued. Web GPU work—similar to WebGL and custom shaders—represents level-seven design in his framework, the kind of stuff that requires specialized knowledge. The skill won't make you a graphics programmer overnight, but it might get you further than fumbling through documentation alone.

"If this sort of stuff interests you, and out of all the tools I talk about here, this is the one that's the most, you know, probably out there, but I liked it," he says.

It's a niche tool for niche needs, but it highlights something important: different design problems require fundamentally different solutions. No single approach will address both "my buttons look generic" and "I need particle effects that respond to scroll velocity."

Google's Entry: Stitch

Stitch, Google's design-to-code tool, approaches the problem from the visual side first. You describe what you want to build, optionally including inspiration screenshots, and Stitch generates design markdown files—structured prompts describing colors, typography, components, and layout philosophy.

What makes Stitch useful isn't necessarily the initial output but the iteration process. It generates multiple variations of your concept simultaneously. You can see three different hero section options side-by-side rather than playing prompt roulette with Claude Code, asking it to "try again" until something clicks.

"It's a lot easier for me to see all three of these and say, 'All right, I hate this. I hate this. Maybe I like this,' versus like, 'All right, nope. Claude Code, try again. Nope, try again. Nope, try again,' " Chase notes.

The tool connects to Claude Code through export functionality—you can copy code directly or work through an MCP connection—though Chase seems skeptical that the automated integration adds much value over the hands-on visual approach. Sometimes friction in the workflow serves a purpose.

The Component Library Approach

21st.dev represents the most straightforward solution on the list: it's a massive library of pre-built components you can copy directly into your projects. Need a hero section with a 3D robot that tracks mouse movement? There's a prompt for that. Want buttons with subtle glow effects? Copy and paste.

Chase suggests the real value lies in the smaller flourishes—the details that signal effort. "Just the fact that this button has this little light on it when I move it around versus your standard button is something that will make your website look better."

But he also emphasizes the educational aspect. For developers without design backgrounds (he includes himself), seeing different approaches to basic elements like buttons expands the possibility space. You can't want what you don't know exists. Exposure builds taste over time.

The component library approach sidesteps the "teach AI good design" problem entirely. Instead of trying to make the AI smarter, you're just... using better building blocks.

Typography as Low-Hanging Fruit

Chase's ninth tool is almost embarrassingly simple: Google Fonts. Just... use Google Fonts. Stop letting Claude Code default to Inter or whatever five typefaces it cycles through.

The simplicity reveals something about current AI coding practice. Many users apparently don't realize they can specify fonts outside the AI's defaults. This isn't a limitation of the technology—it's a knowledge gap about what's possible.

"You would be blown away by the amount of people who do not know that Google Fonts exists," Chase says. "Typography is a huge, huge part of how your design looks and feels."

You can even ask Claude Code to search Google Fonts based on your website's mood and purpose. The AI has access to the entire library; you just need to ask.

What These Tools Actually Solve

None of these tools fundamentally change Claude Code's design capabilities. They work around them. Some (like Impeccable) try to constrain bad outputs through negative examples. Others (like SkillUI and awesome-design.md) bypass the taste problem by copying existing solutions. A few (like Stitch and 21st.dev) shift design decisions to different tools entirely.

The UI/UX Pro Max skill, which Chase describes as "the spiritual successor" to Anthropic's official frontend design skill, takes yet another approach: it asks questions. It tries to understand what you're building—industry, purpose, audience—before generating design systems. It includes 161 industry-specific reasoning rules, which sounds impressive until you consider that "industry-specific reasoning" might just be codified assumptions.

The Taste skill is perhaps the most honest about its limitations. It's "a collection of skills that tries or attempts to give Claude code some measure of taste." Chase's assessment: "It's not mind-blowing, but right away different. And different is good."

That might be the most useful framing. The goal isn't perfection—it's escaping the default. If your site doesn't immediately scream "AI generated this," you've already won something.

The proliferation of these tools—ten covered in twenty minutes, most released within the last month—suggests we're in an active experimentation phase. Nobody has figured out the right approach yet. Maybe nobody will, because "good design" isn't a problem you solve once. The tools that work will be the ones that make it easier for humans to inject their own judgment into the process, not the ones that try to automate taste entirely.

—Marcus Chen-Ramirez, Senior Technology Correspondent