Skip to content
Get packs

No Design Slop

Makes the agent catch generic AI design defaults and UI defects while building or reviewing interfaces

Source Download skill
Repository
MengTo/Skills
Stars
7,187
Licence
MIT
Files
4 files

What it does

Once installed, the agent acts as a design quality gate while it builds, revises, or reviews websites, apps, mockups, and design code. It checks for generic AI-style defaults, decorative choices that serve no purpose, and common UI defects, then removes or fixes the most damaging ones while keeping the product's own look. It is guidance for the agent rather than a standalone tool.

Great for

  • Developers using an AI agent to build landing pages or app interfaces who want less generic output
  • Designers reviewing a screen or mockup who want a structured anti-slop cleanup pass
  • Teams that want a consistent quality checklist applied during UI work

Skip it if

  • Formal design audits that must not change files; the skill points to a separate audit workflow for that, so it is not suited to read-only reviews on its own
  • Projects needing a deliberate new visual identity, since the skill is designed to preserve the existing art direction rather than redesign it

Try asking

  • “Clean up this landing page so it doesn't look like generic AI output, but keep our brand colours and fonts”
  • “Review this app screenshot and tell me which decorative elements can be removed without losing meaning”
  • “Add a pricing section to this site using our existing design system, and check it against the quality gates”
Step-by-step guide: how to use No Design SlopInstall, first run, examples, tips and FAQs

Install in 3 steps

  1. 1

    Download the skill

    The ZIP contains the 4 original files, the MIT licence and an attribution note.

    no-ai-design-slop.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip no-ai-design-slop.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip no-ai-design-slop.zip -d .claude/skills/

    Claude apps (web/desktop): Settings → Capabilities → Skills → Upload skill, and choose the ZIP.

  3. 3

    Ask for the task

    No special command needed — the agent reads the skill's description and loads it when your request matches. Try one of the prompts above.

Get better results

  • Point the agent at your local design tokens, DESIGN.md, or reference screenshots so it judges against your system rather than guessing.
  • For narrow edits, say so explicitly, since the skill is designed to avoid widening small tasks into full site audits.
  • Ask for a rendered check at several viewport sizes so the agent inspects the real interface, not only the source code.

What's inside

  • agents/openai.yaml
  • ARTICLE.md
  • REFERENCES.md
  • SKILL.md

Redistributed unmodified from MengTo/Skills under the MIT licence. The assessment was drafted with AI from the skill's files on 2026-10-29. Skills can instruct your agent to run code — read SKILL.md and any scripts before installing.

Find exactly what
you're looking for