What is Taste Skill?
Taste Skill (Leonxlnx/taste-skill) is an open-source frontend design framework for AI agents designed to solve a universal developer frustration: "AI slop" — the generic, uninspired, template-looking UIs produced by LLMs when writing frontend code.
Created by Leonxlnx and distributed via portable SKILL.md files, Taste Skill equips AI coding agents (such as Claude Code, Cursor, Codex, and Gemini CLI) with strict, battle-tested rules for layout variance, typography hierarchy, fluid motion, design system mapping (shadcn/ui, Radix, Tailwind), and responsive density.
How Taste Skill Works
When an agent loads Taste Skill, it follows an explicit pre-flight design protocol before writing a single line of CSS or TSX:
- Brief Inference — Analyzes the project domain, target audience, brand mood, and information density.
- Design System Mapping — Determines whether to use modern Tailwind, shadcn/ui, Radix, or custom native CSS instead of falling back to default Tailwind utilities.
- Three Controllable Dials — Allows developers to tune:
DESIGN_VARIANCE: From clean/minimalist to bold asymmetric layouts.MOTION_INTENSITY: From subtle hover states to immersive GSAP/Framer Motion interactions.VISUAL_DENSITY: From spacious marketing pages to data-dense enterprise dashboards.
- Audit-First Redesigns — Respects existing codebases and avoids breaking existing component hierarchies during refactors.
Quickstart & Installation
Install Taste Skill across any agent supporting npx skills add or Claude Code plugins:
# Install the core anti-slop frontend skill
npx skills add https://github.com/Leonxlnx/taste-skill --skill "design-taste-frontend"
# Or install directly in Claude Code as a plugin
/plugin marketplace add Leonxlnx/taste-skill
/plugin install taste-skill@taste-skill- Official Web Portal: tasteskill.dev
- GitHub Repository: github.com/Leonxlnx/taste-skill
- Claude Code Guide: Read our complete walkthrough on Claude Code Mods & Plugins.
