Skip to content
Get packs

Anti-UI-Slop Design Guide

Makes an agent build product-specific web or iOS interfaces with a design contract, required states, and a finish check.

Source Download skill
Repository
github/awesome-copilot
Stars
40,703
Licence
MIT
Files
11 files

What it does

When installed, the agent follows a set of design playbooks before building or reviewing a web or iOS screen. It starts from your product's existing components and design tokens, picks one relevant guide (new work, polish, audit, iOS, and so on), and aims for interfaces that look intentional rather than generic. It can optionally pull visual references from the paid UIZZE service, and it ends by rendering and fixing obvious layout breakage if the environment allows.

Great for

  • Developers using a coding agent to build or redesign a web or iOS screen
  • Designers reviewing a UI before shipping and wanting a consistent checklist
  • Teams that want agents to respect an existing design system instead of inventing new styles

Skip it if

  • Projects with no UI work, since the guidance only applies to interfaces; it adds noise to backend tasks
  • Users expecting the free version to supply a large library of screens: the 800,000+ reference claim relies on the optional paid MCP, which is not included in these files

Try asking

  • “Use anti-ui-slop to redesign our settings page using the existing components in src/ui”
  • “Run the UI finish gate on this checkout flow before we ship”
  • “Critique this dashboard for generic UI patterns and suggest fixes grounded in our tokens”
  • “Build this iOS onboarding screen with anti-ui-slop and cover loading and error states”
Step-by-step guide: how to use Anti-UI-Slop Design GuideInstall, first run, examples, tips and FAQs

Install in 3 steps

  1. 1

    Download the skill

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

    anti-ui-slop.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip anti-ui-slop.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

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

  • Give the agent your existing components and design tokens first so it extends them rather than inventing a system
  • Ask for one specific scope (for example, audit only or polish only) so the agent loads a single playbook
  • Treat the optional UIZZE references as suggestions and check that the MCP is actually connected before relying on them

What's inside

  • agents/openai.yaml
  • MANIFEST.json
  • MODIFICATIONS.md
  • reference/audit.md
  • reference/distill.md
  • reference/ios.md
  • reference/new-work.md
  • reference/operate.md
  • reference/polish.md
  • references/uizze-reference-policy.md
  • SKILL.md

Redistributed unmodified from github/awesome-copilot 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.