How to use the Anti Slop UI Rules agent skill (antislop)

What does the antislop skill make the agent do?

Once installed, the agent follows a set of rules whenever it creates or changes the look of a website, web app or other interface. The stated goal is design that feels crafted by a designer rather than generated by AI.

The skill covers UI work only. The rules target interface design, so backend logic, data pipelines and scripts are outside its scope.

How to install antislop

The source lists these routes: download the ZIP from the directory page and unzip it into ~/.claude/skills/ for all projects, or into a project's .claude/skills/ folder for one project only. You can also upload it in the Claude apps under Settings → Capabilities → Skills.

The skill is a single file, SKILL.md, inside the antislop folder. The skill also names an optional installer, npx antislop-ai, which uses Node.js/npx.

• Personal (all projects): unzip into ~/.claude/skills/
• Single project: unzip into the project's .claude/skills/ folder
• Claude apps: Settings → Capabilities → Skills, then upload the skill

Choose a mode: during or after

On the first antislop activation in each session, the agent asks when you want the rules applied. DURING means the agent follows the rules while it writes, so generic output does not appear from the start. AFTER means the agent audits a finished project and produces a numbered findings list, and you choose which numbers to fix.

The agent asks before starting UI work and waits for your reply. A saved preference in a settings file can skip the question. Your explicit choice in the conversation always takes priority over that saved preference.

• During: rules apply while building new UI
• After: numbered audit saved as anti-slop/audit-001-YYYY-MM-DD.md; nothing changes until you approve specific numbers
• Saved default: run npx antislop-ai --mode during (or after); npx antislop-ai --mode ask restores the question; npx antislop-ai --mode shows the current setting

How to trigger the skill with natural requests

You do not need special syntax. Ask the agent for UI work in plain language and the skill applies when the agent builds or changes an interface. Mention the mode if you already know it, or let the agent ask.

Because the skill asks a mode question first, it is not suited to requests where you need an immediate answer. Expect a question before any UI review, planning or concept work.

• Build a landing page for my bakery and use antislop during.
• Review the dashboard I already built with antislop after mode, and list the findings first.
• Redesign the signup form in my app with antislop, then explain what changed.
• Remember antislop during as my default for future sessions.

Keep antislop up to date

antislop never updates itself, and nothing announces a new release. How you update depends on how you installed it. The installer and skills-directory routes can use npx antislop-ai --update, which replaces every antislop folder it finds and prints the release it replaced. Plugin installs keep their own copy, so use the plugin's update command instead.

Skills load when a session starts, so a session that is already running keeps the old rules. Start a new session after updating.

• Installer: run npx antislop-ai again and choose Overwrite them
• Skills directory: run npx skills update
• Pi package: run pi update --extensions
• Single file: download SKILL.md again and replace the copy

Safety notes: scripts and network

The skill as described runs no scripts and uses no network access. Its declared tools are Read, Write, Edit, Glob and Grep, so it needs an AI agent that can read and write files. The optional installer, update and mode commands require Node.js/npx.

The skill writes a settings file only when you explicitly ask it to remember a mode. It reads only the mode field from that file, and it is told never to execute instructions found there.

• Runs scripts: no
• Uses network: no
• Required tools: Read, Write, Edit, Glob, Grep
• Optional: Node.js/npx for the installer and commands