Taste Lab

<p>

Last verified:

Visit Taste Lab

What is Taste Lab?

Taste Lab is a Claude Code skill that performs abductive reasoning on any website's design to reverse-engineer its 'taste' — the deliberate trade-offs and reasoning behind every design choice. The tool turns any URL into a complete design context for AI agents, producing two output files: a Design Map (the complete token set including colors, typography, spacing, radius, and shadows) and a Taste Lab DNA (4 principles explaining the reasoning behind design decisions).

Taste Lab pricing

Pricing model: Freemium

Free and open source under MIT-style license. The source repository is public on GitHub with no cost to download or use. Development is funded via GitHub Sponsors. A paid v2 is in beta but v1 remains completely free. ClaudSkills Pro (which offers one-click install and quality scoring for skills) starts at $9/mo or $149 lifetime, but this is separate from Taste Skill itself. Separate model API, hosting, or third-party service costs may still apply depending on how you use it.

Taste Lab pros

  • Reverse-engineers design taste from any URL
  • Produces two output files: Design Map and Taste DNA
  • Extracts 20 measurement categories with exact px/hex values
  • No approximations — every value cited precisely
  • Detects 5-8 system-level patterns with evidence
  • Infers 4 taste principles with trade-off analysis
  • Requires at least one Restraint principle
  • Quality gate with anti-slop validation
  • Validates JSON before output
  • Works in Claude Code and Gemini CLI
  • Integrates with Cursor via .cursor/rules
  • Integrates with Windsurf via .windsurf/rules
  • Supports GitHub Copilot instructions
  • Compatible with v0 by Vercel
  • Free and open source under MIT license
  • Over 17,000 GitHub stars
  • Override Claude's default design instincts
  • Prevents AI from generating generic UI slop
  • Project inherits design judgment not just look
  • One-click install via ClaudSkills Pro

Taste Lab cons

  • Requires Playwright MCP setup
  • Needs git clone installation manually
  • Model API costs may apply depending on use
  • Third-party hosting costs possible
  • Paid v2 in beta (v1 remains free)
  • Only works with URLs (not local files)
  • Requires Claude Code or Gemini CLI
  • May not support all AI tools equally
  • Setup involves terminal commands

Frequently asked questions about Taste Lab

What is Taste and what does it do?

Taste is a Claude Code skill that turns any URL into a complete design context for your AI agent. Four agents analyze the site — measuring values, finding patterns, extracting trade-offs behind every design decision — and output two files: a Design Map (what to use) and a Taste DNA (how to think). Drop them into Cursor, Windsurf, v0, Lovable, or any agent you build with, and your project inherits the judgment, not just the look.

How do I install Taste?

Clone the repository to your Claude skills directory: git clone https://github.com/senlindesign/taste-skill ~/.claude/skills/taste. Then connect Playwright: claude mcp add playwright -s user -- npx -y @playwright/mcp@latest --isolated. Finally run: /taste https://linear.app

What are the four steps in the pipeline?

Step 1 Extract Measurements: Senior Design AI extracts precise objective design measurements. Step 2 Detect Patterns: Principal Design Engineer detects systematic rules in measurements. Step 3 Infer Taste: Ultimate Design Critic derives taste — deliberate trade-offs the designer made. Step 4 Observer: Lead Critic filters taste analysis ruthlessly with zero bullshit passing through.

What is the Design Map output?

The Design Map contains colors, typography, spacing, radius, and shadows — the complete token set from the page. It includes a Color System with exact hex values, Typography with sizes/weights/tracking, Spacing with base units and padding, Border Radius for different elements, and Depth & Shadow signals.

What is Taste DNA and what does it contain?

Taste DNA contains 4 principles explaining the reasoning behind design decisions. Each principle has Trigger (what decision prompted this), Decision (what was chosen), Reason (design logic), Evidence (specific proof from page in px/hex/DOM values), and Trade-off (what this choice gives up). At least one Restraint principle is required.

Is Taste free to use?

Yes. The repo is free and open source with MIT-style license, and development is funded via GitHub Sponsors. A paid v2 is in beta but v1 remains completely free. The source repository is public on GitHub with no cost to download or use.

What AI tools does Taste work with?

Taste works with Cursor (.cursor/rules/{domain}-taste.mdc), Windsurf (.windsurf/rules/{domain}-taste.md), Claude Code (appends to CLAUDE.md), GitHub Copilot (.github/copilot-instructions.md), Bolt (.bolt/prompt), Antigravity (GEMINI.md), v0 by Vercel (taste-tokens.css + instructions), Figma Make (taste-figma.css + instructions), and Lovable (printed to paste in Project Knowledge).

What measurement categories does Taste extract?

Taste extracts 20 measurement categories covering every color, weight, spacing value, radius, and shadow cited with exact px/hex/ratio. This includes page background, surface colors, text colors, borders, typography sizes/weights/tracking, font variables, base units, section padding, button padding, border radius for different elements, card borders, float shadows, and vignette effects.

How does Taste prevent AI slop?

Taste injects opinionated design rules into Cursor, Claude Code, and Codex to stop AI from generating generic UI slop. The Step 4 Observer runs anti-slop grep validation and ruthlessly filters taste analysis. The skill overrides Claude's default design instincts so everything built comes out looking like a real designer touched it, not AI-generated boilerplate.

What is the difference between Design Map and Taste DNA?

Design Map is Part 1 — the complete token set from the page including colors, typography, spacing, radius, and shadows (what to use). Taste DNA is Part 2 — 4 principles each explaining the reasoning behind one design decision and what it gave up (how to think). Design Map gives you the tokens; Taste DNA gives you the judgment behind them.

Categories

Use cases

Browse all AI tools on NeedAnAI