Stop Claude's Websites Looking AI-Made: The 83K-Star Design Skill
A free design skill for Claude, past 83,000 stars. 61 checks catch the AI-template look, one command polishes fonts, colors and spacing, and it flags generic parts every time Claude edits a page
Ask Claude for a website and you often get the same page everyone else gets: a purple-to-blue gradient, one default font everywhere, cards nested inside cards and a rounded icon tile over every heading. Visitors read it as AI-made in seconds. Someone open-sourced a design skill that fixes that, and it's past 83,000 stars.
Here's what it does, how to set it up in a few minutes, the commands worth using first, and the catches.
What it does
- 61 detector rules for the AI-template look: purple gradients, overused fonts, gray text on colored backgrounds, nested cards, bounce easing, cramped padding, small touch targets, skipped heading levels.
- 24 commands that give Claude a shared design vocabulary, like polish (a final pass before you ship), typeset (fonts), colorize (color), layout (spacing) and critique (a UX review).
- On Claude Code it also installs a hook that runs the detector every time Claude edits a page and hands the findings straight back to Claude.
- It started from Anthropic's own frontend-design skill.
Free, for your email
Get the full setup steps + the copy-paste setup prompt
The rest of this guide (3 more sections, 1 copy-paste prompt) opens right here. The setup prompt, one paste into Claude that sets it all up, comes by email only. Use your real address.
Unlocks: Set it up · The catch · Sources
50,000+ follow where these guides come from. No spam, reply “unsubscribe” any time.