POINT IT AT YOUR VIBE-CODED APP

Shared design memory for you, your agents, and your team.

Harnd — the AI harness for your design system.

Point harnd at the app your agents already built. In minutes, your tokens, components, and the reasoning behind them become one source your agents read before writing UI — and your team can trust. Design quality holds as you add people, agents, and clients.

For engineers and founders shipping UI without a designer on the team.

This is what happens without a harness.

Your agent hardcoded another hex value.

You caught it last week. It's back this week, in a different file.

What design token drift is

Three versions of the same button now exist.

No one meant to. Each agent just built what looked right, in isolation.

How to find look-alike components

Nobody remembers why that decision was made.

The diff survived. The reasoning didn't.

What a design harness is

This is what it says about your repo.

One command, no account, nothing uploaded. Below is the output on a demo project — the numbers are made up, the format is not.

$ npx @harnd/cli scan ✓ scan complete — 214 files analyzed @ 9f3c1a2 7 values in your code sit outside your 22-token scale  — decisions nobody made on purpose. 4 components render the same <button> with the same kind of styling:  PrimaryButton, SubmitButton, CtaButton, ActionButton  They use the same set of utilities: bg, px, py, rounded, text, ….  If that is all that separates them, they are one component with a variant.   Tokens:      22 (22 active) — this run: 22 new  Components:  38 (38 active) — this run: 38 new  Reuse Rate:  31%  Observed:    14 colors / 9 spacing values / 7 arbitrary values Next: run `harnd validate` to detect drift.

Most projects have never declared a token — and find they have been running a design system without noticing.

How it works

1

It reads what your agents already built

Harnd goes through your code and pulls out the colours, spacing and components that are actually in use. Most projects have never declared a token — and find they have been running a design system without noticing.

2

It tells you what went wrong

Four buttons that differ only in colour. Values that sit outside your own scale. Harnd names them from the structure of your code, not from what they are called — and shows what they have in common so you can judge.

3

Your agents read it, and it holds them to it

The tokens, the component definitions, and — crucially — when not to use each one, written where your agent will read them. Then a check runs the moment your agent says it is done, and hands anything it broke straight back to be fixed.

Questions

What do I need to run it?

Node.js 20 or later and a Git repository. No design tool, and no account for the local commands — init, scan and validate all run on your machine.

What setup is it built for?

Claude Code and Tailwind. Harnd writes a plain-Markdown brief that any coding agent can read, and it detects CSS-variable tokens in any stack — but Claude Code is the setup we run it against every day, and it is the one that gets the extra step: a check that fires the moment your agent says it is done. Other agents and other styling approaches are not evaluated yet, so we would rather say so than promise it.

Get early access

Join the waitlist. Three quick questions — that's all.

Which agents do you use?

By joining, you agree to receive occasional product updates and launch announcements from Harnd at this address. Every email has an unsubscribe link, and you can stop them at any time. What we send and how we handle your email

Free while in beta. When we start charging we expect individual pricing to land around $19 a month, with team and enterprise plans after that. None of it is fixed yet, and we will say so here before anything changes.