antislop-ui

Detects and fixes generic AI-generated UI patterns in color, layout, components, and motion.

Updated Sep 17, 2026
One-click install
npx skills add https://github.com/bramanda48/skills --skill antislop-ui-bramanda48
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: antislop-ui
Source: https://github.com/bramanda48/skills/tree/main/skills/antislop-ui
Command: npx skills add https://github.com/bramanda48/skills --skill antislop-ui-bramanda48

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? AI coding agents repeatedly produce the same generic interface patterns: blue-purple gradients, glassmorphism everywhere, bento grids, fake terminal windows, decorative emoji, and dashboards with invented metrics. This Skill gives the agent a concrete catalog of these anti-patterns with the reason each reads as generated and the specific fix, so UI work reflects the product's actual brand and content instead of training-data defaults. ## Core Features & Use Cases - Visual and color rules: Flags default gradients, excessive glassmorphism, glow, soft shadows, background grids, and scattered palettes, with dose caps and palette limits tied to a written brand identity. - Layout and component rules: Covers template landing pages, copy-paste feature cards, bento grids, three-tier pricing, logo bars, fake terminals, decorative badges and status dots, plus app-side patterns like default dashboard shells, invented stat cards, filler activity feeds, and fake placeholder data. - UI Skill Checklist: A 15-item pass/fail checklist run alongside the core antislop Delivery Gate before shipping any interface work. - Use Case: While building a landing page or dashboard, load this Skill with the antislop core so the agent avoids the default hero-plus-feature-grid template, uses real data or honest placeholders, and justifies every accent, animation, and section against the product's design dials. ## Quick Start Load the antislop core and this UI skill, then ask the agent to build or review the interface and run the UI Skill Checklist before delivery.

Frequently Asked Questions about antislop-ui

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I stop AI-generated websites from looking generic?

Load this Skill with the antislop core whenever the task is UI work. It catalogs the default patterns agents reach for, such as blue-purple gradients, bento grids, and template landing sections, and gives the tell, the reason, and the fix for each.

What UI patterns does this skill flag as AI slop?

It flags generic gradients, excessive glassmorphism and glow, uniform border radius, background grids, bento grids, fake terminal windows, decorative emoji, capsule badges, decorative status dots, invented dashboard metrics, filler activity feeds, and endless looping animations, among others.

Does this skill work for dashboards and app screens?

Yes. A dedicated App and Dashboard section covers the default sidebar-plus-stat-cards shell, invented numbers and deltas, filler activity feeds, charts without a question, generic table columns, fake placeholder data, and empty or loading states that say nothing.

Can I use this skill without the antislop core rules?

It is designed to load together with the antislop core file. The UI skill references core rules by number, such as R-01 and R-19, and relies on the core Delivery Gate, so it does not duplicate or renumber those rules.

When should this UI skill be loaded?

Load it whenever the task builds or edits a website, web app, dashboard, or any interface covering color, layout, components, or motion. Non-visual backend or logic tasks do not need it.