Kill AI Slop

https://github.com/yetone/kill-ai-slop
Admin
Kill AI Slop is a website and an Agent Skill that catalogues and helps fix common design patterns...
Tokens:13,000
Snippets:174
Trust Score:9.7
Update:3 months ago
Show doc for...
Tokens:
Raw
### Run the website locally

Source: https://github.com/yetone/kill-ai-slop/blob/main/README.md

Commands to install dependencies and start the development server for the Astro-based website.

```bash
cd website
npm install
npm run dev        # http://localhost:4321
npm run build      # → dist/  (static, deploy anywhere)
```

--------------------------------

### Manual Installation via CLI

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/README.md

Clone the repository and copy the skill directory to the agent's local or global skills folder.

```bash
git clone https://github.com/yetone/kill-ai-slop

# copy the entire directory; for example, with Claude Code:
cp -r kill-ai-slop/skill ~/your-project/.claude/skills/kill-ai-slop   # this project only
cp -r kill-ai-slop/skill ~/.claude/skills/kill-ai-slop                # every project
```

--------------------------------

### Install the agent skill

Source: https://github.com/yetone/kill-ai-slop/blob/main/README.md

Use npx to add the kill-ai-slop skill to your coding agent.

```bash
npx skills add yetone/kill-ai-slop
```

--------------------------------

### Manual installation instructions

Source: https://github.com/yetone/kill-ai-slop/blob/main/README.md

Instructions for manually adding the skill to your agent's directory.

```text
Install the kill-ai-slop skill from
https://github.com/yetone/kill-ai-slop/tree/main/skill

Copy everything in that directory into a kill-ai-slop/ folder
inside your agent's skills directory, then confirm it's registered.
```

--------------------------------

### Report Format Example

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/SKILL.md

The expected format for presenting identified slop hits to the user before applying any fixes.

```text
slop  src/Hero.tsx:12   indigo→violet gradient        → one solid accent
slop  src/Hero.tsx:31   gradient-clip headline        → solid ink, scale up
slop  src/Note.tsx:8    border-l-4 callout ×3         → 1 aside, rest is body
slop  copy.md:1         "not just X — it's Y"         → say the specific thing
→ 4 groups, 11 hits.
```

--------------------------------

### Implement flat type hierarchy

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Use distinct steps in font size and weight to establish a clear visual hierarchy.

```diff
- <p class="text-[15px] font-semibold">Usage this month</p>
- <p class="text-sm text-gray-500">API calls: 48,210 (+12% vs May)</p>
+ <p class="text-xs text-[--ink-2]">API calls this month</p>
+ <p class="text-4xl font-semibold tabular-nums">48,210</p>
+ <p class="text-xs text-[--ink-3]">+12% vs May</p>
```

--------------------------------

### Replace icon tiles with lists

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Use labelled lists for feature descriptions instead of decorative icon tiles.

```diff
- <div class="rounded-xl bg-indigo-100 p-2"><Icon/></div><h3>Fast</h3><p>Very fast.</p>
+ <li><b>Fast</b> — cold start in 180 ms, measured on a 2020 laptop.</li>
```

--------------------------------

### Standardize radius and surfaces

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Use consistent radius tokens and solid surfaces instead of glassmorphism.

```diff
- class="rounded-full backdrop-blur bg-white/10 border border-white/20"
+ class="rounded-[--radius] bg-[--card] border border-[--rule]"
```

--------------------------------

### Run the scanner directly

Source: https://github.com/yetone/kill-ai-slop/blob/main/README.md

Execute the scanner script against a project path to generate reports.

```bash
node skill/scripts/scan.mjs path/to/project          # grouped report
node skill/scripts/scan.mjs path/to/project --json    # machine-readable
```

--------------------------------

### Run Scanner Script

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/README.md

Execute the scanner script to audit a project directory, outputting either a human-readable report or machine-readable JSON.

```bash
node scripts/scan.mjs path/to/src          # human-readable report
node scripts/scan.mjs path/to/src --json   # machine-readable
```

--------------------------------

### Detect Warm cozy palette

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Finds usage of warm-toned color palettes often used in AI-generated UI.

```bash
rg -n -i '\b(amber|orange|stone)-(50|100|200|300)\b'
rg -n -i 'bg-\[#(fdf6ec|fef3e2|faf3e8|fff7ed|fdf4e3)\]'
rg -n -i 'text-amber-[0-9]+|border-amber-[0-9]+'
rg -n -i 'text-(gray|slate|zinc|neutral)-(400|500)[^"]{0,60}bg-(amber|stone|orange|rose|blue|indigo|green)-'
```

--------------------------------

### Simplify icon styling

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Remove unnecessary tinted containers around icons and allow them to inherit text color.

```diff
- <div class="rounded-lg bg-blue-500/10 p-2"><Icon class="text-blue-500"/></div>
+ <Icon class="text-[--ink]"/>          /* just an icon; no tinted tile */
```

--------------------------------

### Detect Max radius and glassmorphism

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Finds instances of full-radius elements combined with backdrop blur effects.

```bash
rg -n 'rounded-full' -g '*.{tsx,jsx,vue,svelte,astro,html}'
rg -n -i 'backdrop-blur|backdrop-filter:\s*blur|bg-white/(5|10|20|30)|bg-black/(5|10|20|30)'
rg -n -i 'border-radius:\s*(9999px|50%|2rem|24px)'
```

--------------------------------

### Detect decorative strikes and highlights

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Search for visual decorations like line-throughs or marks that may indicate non-semantic styling.

```bash
rg -n -i 'line-through' -g '*.{css,scss,tsx,jsx,vue,svelte,astro,html}'
rg -n '<(mark|s|u|del|strike)[\s>]' -g '*.{md,mdx,html,tsx,jsx,vue,svelte,astro}'
rg -n -i 'text-decoration:\s*(line-through|underline)'
```

--------------------------------

### Detect Icon in a tint of itself

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Finds icon tiles where the background color is a translucent tint of the icon's foreground color.

```bash
rg -n -i 'bg-(indigo|blue|green|amber|red|purple|pink)-[0-9]+/(5|10|15|20)[\s\S]{0,60}text-\1-'
rg -n -i 'text-(indigo|blue|green|amber|red|purple|pink)-[0-9]+[\s\S]{0,60}bg-\1-[0-9]+/(5|10|15|20)'
rg -n -i 'rounded-(md|lg|xl)\s+bg-(indigo|blue|green|amber|red)-[0-9]+/(5|10|15|20)'
```

--------------------------------

### Run the AI Slop Scanner

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/SKILL.md

Execute the scanner script to identify potential slop patterns in the codebase. The script supports both human-readable output and machine-readable JSON for triage.

```bash
node scripts/scan.mjs <root>          # human-readable report
node scripts/scan.mjs <root> --json   # machine-readable, for triage
```

--------------------------------

### Detect Gradients as atmosphere

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Searches for page-wide radial glows, card washes, and colored box-shadows.

```bash
rg -n -i 'radial-gradient|bg-\[radial-gradient'
rg -n -i 'linear-gradient[^;]*(to bottom|180deg|to top)'  # top-lighter surface fill
rg -n -i 'bg-gradient-to-(b|t)\b[\s\S]{0,40}from-'
rg -n -i 'repeating-(linear|radial)-gradient'
rg -n -i 'bg-gradient-to-(br|tr|bl|tl)\b[\s\S]{0,40}from-(emerald|green|teal|cyan|purple|violet|fuchsia)-\d+/(5|10|15|20|25)'  # per-card accent-hue wash
rg -n -i 'box-shadow:[^;]*(#(6366f1|8b5cf6|a855f7|22d3ee|06b6d4)|rgba?\(139|rgba?\(168)'  # colored glow accents
```

--------------------------------

### Detect Indigo to Violet gradients

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Searches for common purple-spectrum gradient patterns in CSS and Tailwind classes.

```bash
rg -n -i 'from-(indigo|violet|purple|fuchsia)-[0-9]+ ?.*to-(purple|violet|fuchsia|pink)-[0-9]+'
rg -n -i '(linear-gradient|bg-gradient)[^;]*(#6366f1|#8b5cf6|#a855f7|#7c3aed)'
rg -n -i 'shadow-(purple|violet|indigo)-[0-9]+/[0-9]+'
```

--------------------------------

### Refine hover transitions

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Transition only state-changing properties with standard easing; avoid animating layout properties.

```diff
- class="transition-all duration-500 hover:scale-105 hover:-translate-y-2 hover:shadow-2xl"
+ class="transition-colors duration-150 hover:bg-[--surface-2] hover:border-[--rule-strong]"
```

--------------------------------

### Detect flat type hierarchy

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Identify layouts where headings are barely distinguishable from body text size.

```bash
rg -n '<h[12][^>]*text-(sm|base|lg)\b'
rg -n -i 'font-size:\s*1[4-8]px' -g '*.css'   # then count distinct sizes
```

--------------------------------

### Consolidate Semantic Palette

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Replace rainbow-colored semantic tags with a unified chip component using minimal semantic variants.

```diff
- <span class="bg-blue-50 text-blue-700">Info</span>
- <span class="bg-green-50 text-green-700">Success</span>
- <span class="bg-amber-50 text-amber-700">Warning</span>
- <span class="bg-red-50 text-red-700">Error</span>
+ <span class="chip">Info</span> <span class="chip">Warning</span>
+ <span class="chip chip--ok">Success</span>       /* one chosen green */
+ <span class="chip chip--danger">Error</span>     /* the brand accent */
```

--------------------------------

### Replace Atmospheric Gradients

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Use flat background colors and structural borders instead of radial or linear gradients for surface depth.

```diff
- <body class="bg-[radial-gradient(circle_at_top,#1e293b,#020617)]">
-   <div class="rounded-2xl bg-gradient-to-b from-white/10 to-white/0 …">
-   <div class="rounded-2xl bg-gradient-to-br from-emerald-400/15 to-transparent …">
+ <body class="bg-[--bg]">                 /* one flat colour, held */
+   <div class="rounded-[--radius] bg-[--card] border border-[--rule]">
+   <div class="rounded-[--radius] bg-[--card] border border-[--rule]">
```

--------------------------------

### Refactor Status Box

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Simplify status boxes by using neutral surfaces and borders instead of full-hue backgrounds.

```diff
- <div class="border border-red-500 bg-red-500/10 text-red-500 rounded p-3">
-   Something went wrong.
- </div>
+ <div class="border border-[--rule] bg-[--surface] text-[--ink] rounded p-3">
+   <b>Error</b> — something went wrong.   /* one muted accent, on a neutral surface */
+ </div>
```

--------------------------------

### Detect All-Caps Card Grids

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Identifies repetitive card layouts featuring all-caps micro-labels and specific tracking styles.

```bash
rg -n -i 'grid-cols-3'
rg -n -i 'uppercase[\s\S]{0,30}(text-xs|tracking-wide|tracking-wider)|text-transform:\s*uppercase'
rg -n -i 'everything you need|why (you.?ll love|choose|teams)'
```

--------------------------------

### Detect rounded cards with colored borders

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Find decorative callouts or cards that use thick borders to force emphasis.

```bash
rg -n -i 'border-l-4 .*rounded|rounded.* border-l-4'
rg -n -i 'border-left:\s*[0-9]+px .*;.*border-radius|admonition|callout|\bnote-box\b'
rg -n -i 'border-2\b[\s\S]{0,40}border-(indigo|purple|violet|blue|pink|green)-[0-9]+'
```

--------------------------------

### Optimize drop shadows

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Use subtle shadows or hairline borders to represent elevation.

```diff
- box-shadow: 0 16px 80px 10px rgba(0,0,0,0.36);   /* a room-sized fog */
+ border: 1px solid var(--rule);
+ box-shadow: 0 1px 2px rgba(0,0,0,0.06), 0 4px 10px -6px rgba(0,0,0,0.1);
```

--------------------------------

### Replace generated SVG icons with high-quality assets

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Avoid using crude AI-generated SVG code; use high-quality, refined icon assets instead.

```diff
- <svg viewBox="0 0 48 48"><circle cx="24" cy="24" r="20"/><circle cx="18" cy="20" r="2"/>…</svg>
+ <img src="/icon.svg" alt="" />        /* a real icon: a designer, or a strong image model, refined */
```

--------------------------------

### Detect AI copywriting voice

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Identify common AI-generated marketing phrases and buzzwords.

```bash
rg -n -i "not just .{1,40}\bit'?s\b|say goodbye to|meet your new|supercharge|unlock the power|in seconds, not"
rg -n -i '\b(blazing[- ]fast|effortless|seamless|game[- ]changer|next[- ]level)\b'
rg -n -i '\b(growth|security|process|privacy|productivity|compliance|feature|innovation) theater\b'
```

--------------------------------

### Remove excessive keyword highlighting

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Rely on structure rather than inline styling for emphasis.

```diff
- Our <span class="text-indigo-600 font-semibold">revolutionary</span> platform helps
- <span class="text-pink-600 font-semibold">ambitious</span> teams move faster.
+ A project tracker for engineering teams. It updates issues from your commits.
```

--------------------------------

### Simplify status indicators

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Replace complex animated status dots with flat, simple indicators.

```diff
- <span class="relative flex h-3 w-3">
-   <span class="animate-ping absolute h-full w-full rounded-full bg-green-400 opacity-75"></span>
-   <span class="relative rounded-full h-3 w-3 bg-green-500 shadow-lg shadow-green-500/50"></span>
- </span> Ready
+ <span class="inline-block h-2 w-2 rounded-full bg-[--ok]"></span> Ready
```

--------------------------------

### Detect Tasteful Terminal UI

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Finds monospace font usage and ASCII art patterns often used as decorative UI chrome.

```bash
rg -n -i 'font-mono' -g '*.{tsx,jsx,vue,svelte,astro,html}'
rg -n -i 'font-family:\s*[^;]*(mono|jetbrains|fira code|ibm plex mono|geist mono)'
rg -n '[╔╗╚╝║═▓▒░]|\$ [a-z]' -g '*.{tsx,jsx,vue,svelte,astro,html,md}'
```

--------------------------------

### Detect Rounded-square icon tiles

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Identifies potential icon-in-a-tile patterns using specific Tailwind color and radius classes.

```bash
rg -n -i 'rounded-(lg|xl|2xl) bg-(indigo|purple|blue|green|amber|pink)-(50|100)'
rg -n -i '(lucide|heroicons|@tabler/icons|react-icons)'
rg -n -i '\b[wh]-(20|24|28|32)\b[\s\S]{0,40}(<svg|Icon)'
rg -n '<svg[^>]*(width|height)="(9[6-9]|[1-9][0-9]{2})"'
```

--------------------------------

### Detect highlighted keywords

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Find excessive use of colored or bold spans within body copy.

```bash
rg -n '<mark' -g '*.{md,mdx,html,tsx,jsx,vue,svelte,astro}'
rg -n 'text-(primary|indigo|purple|violet)-[0-9]+' -g '*.{tsx,jsx,vue,svelte,astro,html}'
rg -n -i 'font-semibold|font-bold' -g '*.{md,mdx}'
```

--------------------------------

### Detect kicker/eyebrow headings

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Identify repetitive micro-labels above headings that often add no editorial value.

```bash
rg -n -i 'uppercase[\s\S]{0,40}tracking-(wide|wider|widest)|tracking-(wide|wider|widest)[\s\S]{0,40}uppercase'
rg -n -i '\b(eyebrow|kicker|overline)\b' -g '*.{css,scss,tsx,jsx,vue,svelte,astro,html}'
rg -n -i 'text-transform:\s*uppercase[\s\S]{0,80}letter-spacing:\s*0?\.[0-9]+em'
```

--------------------------------

### Detect full-sentence display headlines

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Find oversized, extrabold headlines with crushed tracking that may indicate poor typography choices.

```bash
rg -n 'text-(5|6|7|8|9)xl' -g '*.{tsx,jsx,vue,svelte,astro,html}'
rg -n -i 'tracking-tighter?\b[\s\S]{0,40}font-(extrabold|black)|font-(extrabold|black)[\s\S]{0,40}tracking-tighter?\b'
rg -n -i 'font-size:\s*(clamp\([^)]*[4-9](rem|\.[0-9]+rem)|[5-9][0-9]px|[4-9]rem)'
```

--------------------------------

### Remove decorative statistics

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Replace generic or 'set dressing' statistics with verifiable, sourced data.

```diff
- <div class="stats"><b>10k+</b> Developers <b>99.9%</b> Uptime <b>24/7</b> Support</div>
+ <p><b>1,847</b> CI runs yesterday, median 3m 12s — from the public status page.</p>
```

--------------------------------

### Replace card grids with clear content

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Replace grids of equal-weight cards with a single, clear, and informative point.

```diff
- <div class="grid grid-cols-3 gap-8"> …6 icon+CAPS-label+one-liner cards… </div>
+ <p class="lead">It replaces your standups.</p>
+ <p>Every morning it reads yesterday's commits and PRs and writes the team a
+ three-line summary.</p>
```

--------------------------------

### Detect Default semantic palette

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Identifies the overuse of standard semantic color pairs (info, warning, success, error) in UI.

```bash
rg -n -i 'bg-(blue|indigo)-50|bg-amber-50|bg-green-50|bg-emerald-50|bg-red-50'
rg -n -i 'text-(blue|indigo)-(600|700).*text-(green|emerald)-(600|700)'  # multiple stock hues near each other
rg -n -i 'info.*blue|warning.*amber|success.*green|error.*red'
```

--------------------------------

### Improve section spacing

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Use semantic sectioning and intentional spacing to group related content.

```diff
- <div class="space-y-4">
-   <h3>Profile</h3><p>Name</p><p>Email</p>
-   <h3>Danger zone</h3><p>Delete workspace</p>
- </div>
+ <section class="mb-8">
+   <h3 class="mb-1.5">Profile</h3><p>Name</p><p>Email</p>
+ </section>
+ <section>
+   <h3 class="mb-1.5">Danger zone</h3><p>Delete workspace</p>
+ </section>
```

--------------------------------

### Remove Decorative Text Formatting

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Eliminate redundant strikes, underlines, or highlights used for emphasis, relying on structure instead.

```diff
- <h1>The <s>old</s> <mark>new</mark> way to <u>ship</u>.</h1>
+ <h1>A faster way to ship.</h1>
```

--------------------------------

### Shorten display headlines

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Compress headlines to improve readability and ensure layout constraints like max-width are not violated.

```diff
- <h1 class="text-7xl font-extrabold tracking-tight">
-   We help modern teams resolve incidents faster than ever before
- </h1>
+ <h1 class="text-5xl font-semibold">Pages the right engineer</h1>
+ <p class="text-lg text-[--ink-2]">It maps alerts to code owners and routes
+ each incident to whoever shipped the change.</p>
```

--------------------------------

### Detect Serif-italic on one word

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Identifies serif font usage or italic tags within sans-serif headings.

```bash
rg -n -i 'font-serif|font-family:\s*(georgia|"?playfair|"?lora|"?cormorant)'
rg -n '<em>|italic' -g '*.{tsx,jsx,vue,svelte,astro,html}'
```

--------------------------------

### Replace Indigo-to-Violet Gradient

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Replace complex gradients with a single solid accent token and remove colored glow shadows.

```diff
- class="bg-gradient-to-r from-indigo-500 to-purple-500 shadow-lg shadow-purple-500/50"
+ class="bg-[--accent]"      /* one solid, chosen accent */
```

--------------------------------

### Remove Decorative Serif-Italic

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Emphasize text through weight or position rather than using decorative serif-italic styles.

```diff
- The editor that <em class="font-serif italic text-indigo-600">actually</em> ships.
+ The editor that <b>ships</b>.        /* emphasise by weight/position, one voice */
```

--------------------------------

### Detect One-hue status box

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Finds alert boxes where the border, text, and background share the same hue.

```bash
rg -n -i 'border-(red|amber|yellow|green|blue)-[0-9]+[^"]*text-\1-[0-9]+'
rg -n -i 'bg-(red|amber|yellow|green)-[0-9]+/(5|10|15|20)'
rg -n -i '(error|warning|success)[^\n]{0,40}(red|amber|yellow|green)-[0-9]+'
```

--------------------------------

### Detect Uniform Spacing

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Identifies components that use a single spacing value for both internal and external layout gaps.

```bash
rg -n '(space-y-4|gap-4)[^"\'\'`]{0,80}(space-y-4|gap-4)'   # the token twice on one line
rg -n -c 'space-y-4|gap-4'                                  # per-file counts; high = lead
```

--------------------------------

### Standardize Font Family

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Use the project's UI sans-serif font token instead of display serifs unless the content is strictly editorial.

```diff
- font-family: "Playfair Display", serif;
+ font-family: var(--font-sans);
```

--------------------------------

### Simplify Gradient Headline Text

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Convert gradient-filled text to a solid color and rely on font weight or size for impact.

```diff
- <h1 class="bg-gradient-to-r from-indigo-500 to-pink-500 bg-clip-text text-transparent">
+ <h1 class="text-[--ink]">          /* solid; go bigger/heavier for impact */
```

--------------------------------

### Collapse callouts into prose

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Avoid excessive callout boxes by using inline text or standard aside elements.

```diff
- <div class="border-l-4 border-indigo-500 rounded-lg bg-indigo-50 p-4">Note …</div>
- <div class="border-l-4 border-amber-500 rounded-lg bg-amber-50 p-4">Tip …</div>
+ <p>… the note, inline as normal prose …</p>
+ <aside class="note">Beta: exports may change format before 1.0.</aside>
```

--------------------------------

### Detect Nested Cards

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Searches for redundant nested UI components that share similar border and radius properties.

```bash
rg -n '<(Card|Panel|Box)[^>]*>\s*<\1' -g '*.{tsx,jsx,vue,svelte}'
rg -n -i 'rounded[^"]*border[^"]*"[\s\S]{0,120}rounded[^"]*border' -g '*.{tsx,jsx,vue,svelte,astro,html}'
```

--------------------------------

### Detect Default Font Choices

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Checks for common default font stacks like Inter or Space Grotesk that may indicate lack of design iteration.

```bash
rg -n -i 'fonts\.googleapis\.com/css2\?family=(Inter|Space\+Grotesk|Manrope|Plus\+Jakarta)'
rg -n -i 'font-family:\s*[^;]*("?Inter"?|"?Space Grotesk"?|"?Manrope"?|"?Plus Jakarta Sans"?|"?Geist"?)'
rg -n 'from ["\'\']next/font/google' -g '*.{ts,tsx,js,jsx}'
```

--------------------------------

### Detect Badge and pill spam

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Finds decorative pill-shaped badges often used for 'new' or 'beta' labels.

```bash
rg -n -i 'rounded-full .*(bg-(indigo|purple|green|amber|pink)-(50|100|200))'
rg -n -i '>(\s*[✨🔥🎉🚀]\s*)?(new|beta|hot|popular|pro|coming soon)\s*<'
```

--------------------------------

### Standardize Warm Palette

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Replace specific amber/stone washes with neutral base tokens while maintaining a single warm accent.

```diff
- bg-[#fdf6ec] text-amber-900 border-amber-200
+ bg-[--paper] text-[--ink] border-[--rule]   /* accent stays for one element */
```

--------------------------------

### Detect Springy hover effects

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Identifies hover animations that use scaling, translation, or bounce easing functions.

```bash
rg -n -i 'hover:(scale-1[01][0-9]|-translate-y-)'
rg -n '\btransition-all\b'
rg -n -i 'cubic-bezier\([^)]*,\s*1\.[2-9][0-9]*'   # overshoot easing = bounce
rg -n -i 'animate-bounce|transition:[^;]*\b(width|height|margin|padding)\b'
```

--------------------------------

### Standardize Font Usage with CSS Variables

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Replace hardcoded font-family declarations with CSS variables to ensure intentional font selection and documentation of design choices.

```diff
- font-family: "Space Grotesk", sans-serif;   /* display */
- font-family: "Inter", sans-serif;           /* body — the stock pairing */
+ font-family: var(--font-sans);   /* one face, compared and chosen — with the
+                                     reason recorded in the tokens file */
```

--------------------------------

### Replace decorative pills with status tags

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Remove decorative pill elements and replace them with meaningful status indicators.

```diff
- <h1>Dashboard</h1><Pill>✨ New</Pill><Pill>🔥 Popular</Pill><Pill>β Beta</Pill>
+ <h1>Dashboard</h1><span class="ver">v2.1</span>
```

--------------------------------

### Detect Gradient headline text

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Identifies CSS patterns where text is clipped to a background gradient.

```bash
rg -n 'bg-clip-text.*text-transparent|text-transparent.*bg-clip-text'
rg -n '(-webkit-)?background-clip:\s*text'
rg -n -i '-webkit-text-fill-color:\s*transparent'
```

--------------------------------

### Detect Section Markers

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Locates giant faint ordinal markers (01, 02, etc.) often used in unordered marketing sections.

```bash
rg -n '["\'\'>`]0[1-9]["\'\'<`]' -g '*.{tsx,jsx,vue,svelte,astro,html}'
rg -n -i 'text-(7|8|9)xl[\s\S]{0,50}(text-(gray|slate|zinc|neutral)-(100|200)|opacity-(5|10|20))'
rg -n -i 'step[- ](one|two|three)'
```

--------------------------------

### Fix border and radius clipping

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Apply the border and radius to the same container to prevent the stroke from being clipped at the corners.

```diff
- <div class="rounded-xl overflow-hidden">      /* wrapper owns the radius… */
-   <table class="border divide-y">…</table>    /* …child owns the stroke — erased at every corner */
- </div>
+ <div class="rounded-xl overflow-hidden border border-[--rule]">  /* same box: the stroke wraps the arc */
+   <table class="divide-y">…</table>
+ </div>
```

--------------------------------

### Detect Invented Stat Rows

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Finds generic 'stat' rows containing common placeholder numbers like 99.9% or 24/7.

```bash
rg -n -i '\b[0-9]+[km]\+'
rg -n '99\.9%|24/7'
rg -n -i '(10k|50k|99\.9|24/7)[\s\S]{0,60}(developers|users|teams|uptime|support|countries)'
```

--------------------------------

### Restrict Terminal Aesthetics to Code Blocks

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Limit monospace fonts and terminal-style visuals to code-specific elements like <pre> and <code> tags, using standard sans-serif fonts for general UI content.

```diff
- <body class="font-mono bg-[#0a0a0a] text-amber-400">
-   <pre>  ╔══════════════╗
-          ║  WELCOME  ║
-          ╚══════════════╝</pre>
+ <body class="font-sans bg-[--bg] text-[--ink]">
+   <h1>Welcome</h1>          /* mono stays in <code>/<pre> for actual code */
```

--------------------------------

### Detect Serif where sans belongs

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Finds display serif fonts used in UI or body text where they are inappropriate.

```bash
rg -n -i 'font-family:\s*[^;]*(playfair|cormorant|lora|"?dm serif|"?libre baskerville)'
rg -n -i "fontFamily.*(Playfair|Cormorant|Lora)"
rg -n -i 'font-serif[^"]{0,60}(italic|text-[4-9]xl)|(italic|text-[4-9]xl)[^"]{0,60}font-serif'
```

--------------------------------

### Detect glowing status dots

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Identify status indicators that use excessive animation or glow effects.

```bash
rg -n -i 'animate-ping|animate-pulse'
rg -n -i 'shadow-(green|emerald|lime)-[0-9]+/[0-9]+|box-shadow:[^;]*(0 0|glow)'
rg -n -i '(ready|online|live)[\s\S]{0,40}(●|rounded-full)'
```

--------------------------------

### Flatten nested card structures

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Avoid nesting cards; use a single surface with rows separated by hairlines.

```diff
- <div class="card"><div class="card"><div class="card">Pro — $8/mo</div></div></div>
+ <div class="card">
+   <h3>Billing</h3>
+   <div class="row">Plan <b>Pro — $8/mo</b></div>    /* rows split by hairlines */
+   <div class="row">Renews <b>May 3</b></div>
+ </div>
```

--------------------------------

### Detect excessive emoji usage

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Find patterns where emojis are used as decorative bullets or heading prefixes.

```bash
rg -n '[\x{1F000}-\x{1FAFF}\x{2600}-\x{27BF}\x{2190}-\x{21FF}\x{2B00}-\x{2BFF}]' -g '*.{md,mdx,html,tsx,jsx,vue,svelte,astro}'
rg -n -i '(🚀|✨|⚡|🔒|🎉).{0,40}(<|$)'  # emoji leading a heading/button/bullet
```

--------------------------------

### Detect AI-drawn SVG icons

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Locates inline SVGs that may represent simple primitive-based mascot or blob icons.

```bash
rg -n '<svg' -g '*.{tsx,jsx,vue,svelte,astro,html,svg}'
rg -n -i '<circle[^>]*r="[0-9]'  # dot eyes / blob body built from primitives
rg -n -i '(mascot|blob|logo)\.svg'
```

--------------------------------

### Detect Non-nesting corners

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Searches for identical radius tokens on nested containers, which prevents concentric corner alignment.

```bash
rg -n -i 'rounded-(xl|2xl|3xl)' -g '*.{tsx,jsx,vue,svelte,astro,html}'  # then check for nesting
rg -n -i 'border-radius:\s*(1rem|1\.5rem|24px|32px)'
```

--------------------------------

### Detect Oversized drop shadows

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Flags excessively large blur or spread values in CSS box-shadows and Tailwind utilities.

```bash
rg -n -i 'box-shadow:[^;{}]*\b([6-9][0-9]|[0-9]{3,})px'   # a 60px+ blur/spread
rg -n -i 'shadow-\[[^\]]*\b([6-9][0-9]|[0-9]{3,})px'      # tailwind arbitrary shadow
rg -n -i 'filter:[^;{}]*drop-shadow\([^)]*\b([6-9][0-9]|[0-9]{3,})px'
rg -n -i '\bborder\b[\s\S]{0,40}shadow-(xl|2xl)|shadow-(xl|2xl)[\s\S]{0,40}\bborder\b'
```

--------------------------------

### Remove Redundant Heading Kickers

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Delete kicker labels that restate the heading content, using spacing and scale to define sections instead.

```diff
- <p class="text-xs uppercase tracking-widest text-indigo-500">Features</p>
- <h2>What it does</h2>
+ <h2>What it does</h2>       /* scale and space introduce the section */
```

--------------------------------

### Detect Border clipping at corners

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/detection.md

Identifies patterns where a border is clipped by an overflow-hidden wrapper or clip-path.

```bash
rg -n -i 'rounded-(lg|xl|2xl|3xl)[^"]{0,60}overflow-(hidden|clip)|overflow-(hidden|clip)[^"]{0,60}rounded-(lg|xl|2xl|3xl)'   # clipping wrapper: check the child for a border
rg -n -i 'clip-path:\s*inset\([^)]*round'
rg -n -i 'border-[trbl]\b[^"]{0,60}rounded-(lg|xl|2xl|3xl)|rounded-(lg|xl|2xl|3xl)[^"]{0,60}border-[trbl]\b'
```

--------------------------------

### Adjust nested corner radii

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Calculate inner radii based on padding to prevent visual distortion in nested elements.

```diff
- <div class="rounded-2xl p-3"><div class="rounded-2xl">…</div></div>   /* both 16px */
+ <div class="rounded-2xl p-3"><div class="rounded-lg">…</div></div>   /* 16 − 12 ≈ 8 */
```

--------------------------------

### Refine AI copywriting voice

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Rewrite content to be specific and remove marketing-heavy framing.

```diff
- It's not just an editor — it's a movement. Say goodbye to friction.
+ A code editor. Opens in under a second, ~half the memory of Electron editors.
- We killed the standup theater.
+ It replaces the daily standup with a three-line summary of yesterday's PRs.
```

--------------------------------

### Remove ornamental section markers

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Delete large, decorative ordinal numbers from sections that are not part of a formal sequence.

```diff
- <span class="text-8xl font-extrabold text-gray-100">01</span><h2>Collaborate</h2>
- <span class="text-8xl font-extrabold text-gray-100">02</span><h2>Innovate</h2>
+ <h2>Collaborate</h2>            /* sections distinguished by scale and space */
```

--------------------------------

### Remove decorative emojis

Source: https://github.com/yetone/kill-ai-slop/blob/main/skill/references/fixes.md

Limit emoji usage to functional status indicators only.

```diff
- <h2>🚀 Why you'll love it</h2>
+ <h2>Why teams pick it</h2>
```
Tokens:
Raw