TasteCheck

Your AI-built UI stops looking AI-built. TasteCheck is a set of skills for coding agents. A short design interview and a deslop pass fix the generic look. A ship gate then checks the result and says SHIP or HOLD, with evidence.

Release inventory: v1.7.0 · 20 skills · 20 canonical commands · 1 alias · 21 command files · 8 gallery systems.

Quickstart

1. Install: git clone https://github.com/KyaniteLabs/tastecheck && ./tastecheck/install.sh
2. Open your coding agent in your project.
3. Run /designsystem. Answer a few questions; it writes DESIGN-SYSTEM.md.

Skills are plain Markdown, so any agent that can read files can use them. Slash commands are for Claude Code.

The three commands to know

Command	Use it when
/designsystem	You are starting. It interviews you and sets the design direction.
/deslop	You have UI that looks generic. It finds and removes the tells.
/tastecheckpass	You want to ship. It checks the real page and returns SHIP or HOLD.

Ship gate and evidence harness

There is no published audit CLI. After install, /tastecheckpass is the ship gate: an agent loads the real page and returns SHIP or HOLD with evidence.

At v1.7.0 the browser evidence driver is skills/tastecheck-pass/assets/cdp-qa.mjs, an eight-section harness: cold load, gate-audit.js, keyboard tab trace, 320px reflow, contrast samples, optional curate path, AX-tree summary, screenshots. Run it from a git checkout if you need that evidence bag. Node 22+ applies only to that driver (it uses Node's built-in WebSocket) and a local Chrome — not to install.sh or the skills, and not as a package floor.

The 20 skills

Skill	What it does
design-system-interview	Interviews you, then writes a design direction (type, color, density, tokens).
tasteroll	Rolls and locks a design direction when the brief is open.
improve-existing-website	Audits an existing site and keeps its identity while fixing it.
color-system	OKLCH palettes, semantic tokens, contrast.
web-typography	Type systems, font loading, multilingual glyphs, hierarchy.
spacing-system	Rhythm, density, gaps, spacing scales.
theming	Light, dark, forced-colors, saved preference, no flash.
responsive-layout	Narrow containers, long content, zoom, reflow, overflow.
component-states	State matrices, keyboard behavior, ARIA.
form-ux

How the gate works

/tastecheckpass loads the real rendered page and runs named checks: console errors, keyboard-only use, 320px and 400% zoom, tap targets, measured contrast, reduced motion, broken links and assets, leaked secrets, and template tells. It reports the verdict first, then one evidence line per check.

Three rules apply:

• A checkmark is not evidence. A check counts only if it ran and can cite what it saw (a selector, a URL, a number, a console line).
• It fails closed. A required check that fails, could not run, or has no evidence is HOLD.
• n/a means the subject is absent, never "not tested".

There is a fast lane (one agent, minutes) and a deep lane (a hashed one-row-per-check ledger run by a deterministic script, with independent review on subjective rows). Subjective rows remain accountable human or agent judgment, not an objective guarantee. Details are in docs/VERIFICATION.md.

What we've measured, and what we haven't yet

Release status: PASS — current source-bound release receipts cover the asserted browser and accessibility checks. Effectiveness status: BLOCKED — historical evidence did not clear its release threshold.

The gate has a labeled test corpus (evals/corpus/) and CI fails any change that makes its error counts worse. At v1.7.0, 17 cases: 12 true positives, 1 false negative, 4 true negatives, 0 false positives.

Read that number carefully. Only 2 of the 17 cases are visual-taste tells. The other 15 test gate integrity: forged or stale receipts, ledger tampering, leak detection. So this measures whether the gate can be fooled, not whether it has good design judgment. The one miss is a falsified but internally consistent observation, which cannot be caught offline.

There is also a separate visual corpus (evals/taste/, 36 pages: 20 generic AI-default, 16 deliberately designed). The browser tell detector flags 19 of the 20 generic pages and none of the 16 designed ones. It counts surface tells such as default fonts, indigo-violet gradients, identical card grids, stat bands and pill buttons. It does not judge composition or brand fit. Most pages were written or marked by us, so treat this as a regression floor, not proof of design quality. Its first run flagged 6 of our own gallery pages (they show a purple swatch as an example of what they reject); we fixed that and kept the before-and-after record in evals/taste/TASTE-CORPUS.md.

"Effectiveness BLOCKED" means we have not yet shown, with a controlled comparison, that using TasteCheck produces better interfaces. An earlier attempt did not clear its threshold, and we do not claim a result until one does. Also not measured: agreement between different models or reviewers.

npm test checks repository contracts, install, links and verification plumbing. It is engineering evidence, not an effectiveness claim.

Install

git clone https://github.com/KyaniteLabs/tastecheck && ./tastecheck/install.sh

That is the install path. The installer links skills into ~/.agents/skills/ and into any agent skill directories it detects. For Claude Code it can also link the 21 command files (20 commands plus the /darkmode alias for /theming) into ~/.claude/commands/. install.sh needs a POSIX shell. On Windows, use WSL or Git Bash.

Also: the gate has checks for video artifacts (reading time, authored motion, readability, audio presence).

Gallery

Eight browser-rendered design systems for the same product story. They show how far directions can differ; derive your own rather than copying one.

System	Territory	Signature structure
Copper	dark, warm, geological	irregular tessellated bento with structural basalt columns
Swiss	light, austere, exact	exposed column grid carrying the content
Maximal	loud, kinetic	display word bleeding into a magenta block with sticker-wall collage
Concrete	raw, mechanical, monochrome	ruled spec sheet with a dense ledger table and hazard accent
Clay	warm, soft, humanist	alternating zig-zag card flow with organic pebble shapes
Dispatch	dark, operational, emerald	reverse-chronological release timeline
Verge	cool, clinical, measured	hypothesis-to-verdict evidence cards
Seed	warm, procedural, annotated	seeded specimen card with rolled dimensions

Live: landing page, gallery.

FAQ

How is this different from a design prompt? It makes design decisions explicit before the agent builds, then checks the built page against them.

Does it replace a designer? No. Subjective checks stay human judgment.

Is it free? Yes, MIT.

License

MIT. See LICENSE. Contributions: CONTRIBUTING.md. Security reports: SECURITY.md.

GitHub (KyaniteLabs/tastecheck) is the home for code, issues and pull requests.