Overview
taste-skill is an open-source project by Leonxlnx (a 16-year-old developer) that addresses a specific problem in AI-assisted frontend development: nearly every AI-generated page looks the same. The framework, branded as *The Anti-Slop Frontend Framework for AI Agents*, uses a single Markdown file to steer AI coding tools away from generic templates.
- Repo: https://github.com/Leonxlnx/taste-skill
- Website: https://www.tasteskill.dev/
- Install:
npx skills add https://github.com/Leonxlnx/taste-skill - The slop problem. LLMs generate frontend code by regressing to the most common patterns in their training data (Tailwind templates, blue-purple gradients, centered hero sections,
rounded-xlcards). The result is statistical mediocrity, not intentional design. - Mechanism: SKILL.md context injection. AI tools like Claude Code, Codex, Cursor, v0, and Bolt natively read a
SKILL.mdfile from the project directory before generating code. taste-skill ships a carefully authored version that lists forbidden patterns, establishes design principles, and configures three numeric knobs. - Three tunable knobs (1–10):
DESIGN_VARIANCE— controls layout experimentation (centered/symmetric → asymmetric grids → experimental typography)MOTION_INTENSITY— controls animation depth (hover-only → scroll/parallax → magnetic physics, 3D)VISUAL_DENSITY— controls information density (spacious whitespace → balanced → dense dashboards)- Negative instructions matter. Explicit prohibitions (e.g., "no blue-purple gradients," "no default rounded-xl") are more salient in LLM attention than positive ones, which is why the anti-slop effect is strong.
- v2 workflow. v2 simulates a human designer's process: read brief → infer design language → map design system → apply hard rules → scaffold GSAP animations → audit existing UI (for redesigns) → pre-flight check before output.
- 13 variants available, including
design-taste-frontend(default v2),design-taste-frontend-v1(stable original),gpt-taste(stricter for GPT/Codex),high-end-visual-design(soft/luxury),minimalist-ui,industrial-brutalist-ui,image-to-code,redesign-existing-projects,full-output-enforcement,imagegen-frontend-web,imagegen-frontend-mobile,brandkit, andstitch-design-taste. - Tool compatibility. Works with Claude Code, Codex, Cursor, v0, Bolt, and any LLM that accepts Markdown instructions.
- v2 is experimental; pin to v1 (
design-taste-frontend-v1) for stable output. - A Markdown rule set cannot replace genuine human design judgment, user research, or systems thinking.
- Risk of *meta-slop*: if every AI frontend developer converges on taste-skill defaults, the framework itself could become a new default template. Diversity of knob values and variant selection mitigates this.
Key points
Before vs. After (illustrative)
Without taste-skill, a typical AI-generated page: centered hero with blue-purple gradient, three feature cards, blue rounded-xl CTA, Inter font, slate-50 background.
With taste-skill at DESIGN_VARIANCE=8, MOTION_INTENSITY=7, VISUAL_DENSITY=4: asymmetric hero with overflowing image, custom display + monospace pairing, GSAP scroll-triggered parallax and SplitText reveals, monochromatic palette inferred from brief, sharp 2px corners, no gratuitous animation.
Limitations
Why it matters
taste-skill reframes "taste" from an incommunicable intuition into a version-controlled, declarative configuration file, much like .prettierrc standardized code formatting. It demonstrates that smarter context can outperform bigger models for specific output-quality problems, and points toward a near-term workflow where humans author taste files while AI handles execution.