Skip to content

Anti Slop UI Rules

Makes the agent build websites and app interfaces that look designed by a person, not generic AI output.

Stars
7,976
Licence
MIT
Files
1 file

What it does

Once installed, the agent follows a set of rules whenever it creates or changes the look of a website, web app, or other interface, aiming for crafted, less generic design. Before starting UI work, it asks whether you want these rules applied while building (during) or as a review afterwards (after), or reads a saved preference from a small settings file. The skill also explains how to update it, depending on how it was installed.

Great for

  • Developers who let an AI agent build frontend pages and want less template-looking output
  • Designers reviewing or guiding AI-generated interfaces
  • Anyone who wants a consistent mode choice across sessions via a saved setting

Skip it if

  • Non-UI coding tasks such as backend logic, data pipelines or scripts, since the rules target interface design
  • Users who expect the skill to update itself automatically: the file says it never updates and does not announce new releases
  • Situations needing an immediate answer, because the skill asks a mode question first and waits for a reply before UI work

Try asking

  • “Build a landing page for my bakery website using antislop rules”
  • “Review this React dashboard for generic AI styling, do not edit files”
  • “Use antislop during for this session and create a signup form”
  • “How do I update antislop if I installed it with npx?”
Step-by-step guide: how to use Anti Slop UI RulesInstall, first run, examples, tips and FAQs

Install in 3 steps

  1. 1

    Download the skill

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

    antislop.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip antislop.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip antislop.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

  • Pick a mode explicitly at the start of a session, or save one with npx antislop-ai --mode during to avoid repeated questions
  • Start a new session after updating, because skills load only when a session starts
  • Say explicitly if you want antislop to edit files or only review, since the rules differ by mode

What's inside

  • SKILL.md

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