Taste Skill
Description
Claude Code skill — reverse-engineer any website's design taste: concrete tokens + opinionated trade-offs (WHY, not just WHAT)
Installation
This entry records only its repository, not the path inside it, so there is no
exact command to give. Open the source below and copy the folder into
~/.claude/skills/, or the file into ~/.claude/agents/.
README
/taste — Design DNA Extractor
[](https://docs.anthropic.com/en/docs/claude-code) [](https://ai.google.dev/gemini-api/docs/gemini-cli) [](https://playwright.dev/docs/api/class-playwright) [](LICENSE) [](https://www.tastelab.xyz)
Reverse-engineer any website's design taste. Tokens + trade-offs — not just "what", but "why".
**Quick start:** Clone into `~/.claude/skills/taste`, install Playwright MCP, run `/taste `. [Full install guide below.](#installation)
Why?
Every design extraction tool gives you tokens. "The background is #08090A. The font is Inter. The radius is 6px." That's not taste — that's a spec sheet. When an AI agent has only tokens, it copies the numbers without understanding the decisions behind them. The output looks vaguely right but generates slop the moment the template runs out.
Taste is the "why" behind the tokens: *why* this specific white instead of a branded accent color, *why* 1px inset border instead of a drop shadow, *why* the breathing room lives inside sections instead of between them. An agent with taste can make the right call on a page it's never seen. An agent with only tokens just applies the stylesheet.
`/taste` runs a 4-step pipeline on any URL and produces a `{domain}.md` and `{domain}.json` that explain both.
What It Produces
Running `/taste https://linear.app` writes two files:
**`linear.md`** — Design Map + Taste DNA:
## Design Map
Background: #08090A
Surface (card): rgba(255,255,255,0.05)
Text
Related Skills
Algorithmic Art
Create generative art using p5.js with seeded randomness, flow fields, and particle systems
Design Brand Guidelines
Apply Anthropic's official brand colors and typography to artifacts
Design Canvas Design
Create beautiful visual art in PNG and PDF documents using design philosophy
Design Frontend Design
Create distinctive, production-grade frontend interfaces with high design quality
Design Slack Gif Creator
Create animated GIFs optimized for Slack's size constraints
Design Theme Factory
Style artifacts with professional themes including 10 pre-set color/font combinations
Design Related Agents
Codemod Runner
Writes and runs codemod scripts that replace hardcoded visual values with token references in ui/src/index.css
Designguru
Expert Design Guidance & Analysis Specialist who provides professional UI/UX insights, design system guidance,
Html Css
| Web standards for semantic markup, maintainable styling, and accessibility. | - | [wshobson/agents](https://