Tastemaker is a free, open-source, local skill that gives coding agents (Claude Code, Gemini CLI, Windsurf) a real design process. Instead of guessing a palette and a layout, it studies real references first, locks a contrast-checked style, casts real assets instead of placeholders, and remembers what you keep or reject across projects.

How do I install Tastemaker?

Run npx skills add codeswithroh/tastemaker. Claude Code users can alternatively install it through the plugin marketplace described in the project's README.

design taste for coding agents

Your agent writes working code.
It doesn't write good taste.

Q: How is Tastemaker different from a component library or a Figma-to-code tool?

A component library or Figma-to-code tool gives an agent parts. Tastemaker gives it a process: mandatory reference study, a locked palette checked against real WCAG contrast math, a mechanical anti-slop scan for generic AI-UI patterns, and cross-project memory, all of which run before a design is allowed to ship.

Tastemaker is a local skill that gives Claude Code, Gemini CLI, and Windsurf a real design process: study references, lock a palette that passes contrast, cast real assets, and remember what you keep.

npx skills add codeswithroh/tastemaker

See the proof

Read the source

Not a prompt pack. A real local skill.

SKILL.md anti-slop gates motion rules taste memory

the problem

Every agent defaults to the same page.

Purple-to-indigo gradient hero. Rounded card, soft shadow. A palette picked because it looked fine in the moment, never checked against anything. Ask ten agents for a landing page and you'll recognize the ninth one before it finishes rendering.

$ anti_slop_scan.py generic-agent-output.html

HIGHai-gradientindigo-to-purple hero, unrelated to the product underneath it
HIGHunchecked-contrastcolors picked by eye, never run against a single pairing
MEDno-style-locknext screen in the same session drifts, nothing persists

how it works

Six checks run before the first component exists.

Every one of these is real: a script, a Markdown file, or a gate that has to pass. Nothing here is decorative.

$ tastemaker build --project tastemaker-skill.online

PASSreference-intelligencecompetitor + cultural board built before the first color
PASScontrast-checkevery pairing run through real WCAG math
PASSreal-assetsreal photography, real icons, real screenshots, no gray boxes
PASSmotion-by-defaultscroll-driven reveals ship in the same pass, not a later step
PASSstyle-lockpalette and type reused on every later screen, not re-derived
PASSregister-varietybrutalist, glassmorphic, minimalist, or calm — one committed direction

proof, not claims

Checked with real math, not eyeballed.

Every pairing on this page runs through check_contrast.py before it ships. These are this page's actual numbers.

text / background 16.15 PASS

label / primary 4.63 PASS

accent / dark surface 6.60 PASS

See the full before/after comparison

premium modes

Different products shouldn't wear the same suit.

Four sponsor-exclusive visual registers, generated by the same engine, committing to a real direction instead of a default.

Brutalist mode: a finance dashboard with heavy black type, a yellow highlight block, and hard-edged cards. — **Brutalist**Heavy type, hard edges, no apology.

Glassmorphic mode: a design-review tool with soft frosted panels over a warm gradient. — **Glassmorphic**Layered translucency, soft depth.

Minimalist mode: a clean, restrained product screen with generous whitespace. — **Minimalist**Restraint as the whole style.

Soft calm mode: a gentle, low-contrast interface with rounded, quiet shapes. — **Soft / Calm**Low contrast, unhurried pacing.

Sponsor-exclusive, on top of the free core skill.

Unlock for $8/month

what changed

The skill remembers your taste.

Project style choices live in the repo. Personal preferences can live locally. A rejected direction becomes a guardrail for next time instead of getting forgotten.

.tastemaker/this project

├── style-lock.md Palette, type, shape, assets, motion, and do-not rules for this project.

└── decisions.log Append-only keep, reject, and pending-review decisions from every design pass.

~/.tastemaker/your machine, every project

└── profile.md Reusable preferences, promoted only when you choose or repeat them.

questions

Straight answers, no marketing copy.

What is Tastemaker?

A free, open-source, local skill that gives coding agents a real design process. Instead of guessing a palette and layout, it studies real references first, locks a contrast-checked style, casts real assets instead of placeholders, and remembers what you keep or reject across projects.

How is it different from a component library or a Figma-to-code tool?

Those give an agent parts. Tastemaker gives it a process: mandatory reference study, a palette checked against real WCAG contrast math, a mechanical anti-slop scan for generic AI-UI patterns, and cross-project memory — all of which run before a design is allowed to ship.

Does it cost anything?

No. Tastemaker is free and MIT-licensed.

Which coding agents does it work with?

Claude Code (as a skill and via its plugin marketplace), Gemini CLI, Windsurf, and any agent that can read a local SKILL.md-style skill file.

Does it send my project data anywhere?

No. Tastemaker runs entirely locally as a skill file plus Python scripts. There is no account, no hosted service, and no data leaves your project.

How do I install it?

Run npx skills add codeswithroh/tastemaker. Claude Code users can also install it through the plugin marketplace described in the project's README.

free and local

Install once. Ask normally.

No hosted editor, no account, no separate design handoff. The taste layer lives where the agent already works.