Anti-slopUI QualityDesignAI Agent Skill
install-anti-slop
A quick-install rule set that blocks common "AI slop" patterns (default purple gradients, generic icons, uniform padding) from the start.
Install Options
Install into Claude Code, Cursor, Codex, or Antigravity with:
$ npx skills add dmmulroy/anti-slop@install-anti-slop
Real Work Situation Solved
AI-generated UI looks generic - bring it up to premium quality
“The AI just generated a UI, and it screams "AI made this" - what do you fix before shipping?”
5-Step Action Framework
- 1Check whitespace and alignment - AI defaults to uniform padding/margin with no visual hierarchy. Widen spacing between groups, tighten it within a group.
- 2Check the color palette - AI defaults to a purple-blue gradient or too many accent colors at once. Limit it to one primary accent, everything else neutral.
- 3Check typography - AI tends to use one font size for every content level. Build a clear hierarchy: heading, subheading, body should differ visibly in size/weight.
- 4Check icons and illustrations - AI tends to drop in generic icons (lightbulb, rocket, checkmark) unrelated to the actual content. Swap in icons/imagery specific to this product's context.
- 5Compare against one product you genuinely find beautiful (not AI-made) - list 3 concrete differences, then fix each one.
Before
"The UI has all the buttons and text and it works - ship it as is."
After
"Pass again: drop the default purple gradient, swap the generic lightbulb icon for one specific to this feature, increase spacing between cards from 8px to 24px, cut down to one accent color instead of four."
SKILL.md Source Instructions
SKILL.md • Read-only preview# Install Anti-Slop Skill Drop in a checklist that runs automatically before any UI is presented as finished, catching default-gradient, generic-icon, and uniform-spacing tells before they ship.