hallmark

Sun, 25 Oct 2026 20:38:51 +0800

Nutlope/hallmark

Hallmark

A design skill for Claude Code, Codex, Cursor and OpenCode that refuses to look AI-generated.

usehallmark.com · forty-eight themes · custom on request · redesign and audit by name

Made by Together AI.

Hallmark holds a hard floor and then gets out of the way. It deals three themes from a catalog of forty-eight materials, builds the page around what the visitor came to do, and lints the result in a real browser against the tells that read as machine-made: the eyebrow above every heading, tracked-capital labels, one coloured word in a headline, a page of empty frames or nothing but photographs, a hero that misses its screen, an email sign-up at the end of every page, a form that says thanks without sending anything. A fresh-context reviewer gets the last word.

The gates come in tiers. The Floor never ships (contrast, focus, reduced motion, invented facts, a broken phone layout). Reflex gates are the defaults a model falls into; a build with a reason may overrule one on the record. Finish checks are craft detail that never blocks a ship.

New in v2

Forty-eight themes. Each is a material (paper, type, colour, surfaces, its own components and texture) with a picture of a finished page, and the build lays out its own page in it.
Built from the job. A booking page books, a shop sells, a newsletter subscribes: the action sits where the category puts it, and the page ends on it.
Custom. Ask for a custom page and Hallmark designs from your prompt alone, under the same rules and checks.
Your real product. Point it at a URL, a dev server or an app and it captures the screenshots itself.
Real photographs. 755 openly licensed photos, picked per subject and credited on the page.
Redesign and audit. /hallmark redesign <path> rebuilds a page and keeps its content and wiring; /hallmark audit <path> only reports.

Themes


Dusk _{Closewise, bank reconciliation}	Cobalt _{Relay, a webhook API}	Studio _{Field Office, an identity studio}	Atelier _{Maison Orla, a fragrance atelier}	Ribbon _{Lull, a sleep sounds app}

Furrow _{Fieldbook, farm records}	Dose _{Tandem, a family medication app}	Hum _{Sprout, a reading game for kids}	Terminal _{burrow, a dotfiles CLI}	Hedgerow _{Five Mile Gin, a distillery}

Ten of the forty-eight. A theme is a material, not a plan: it never says what a page contains or in what order, so two prompts in one theme make two different pages. Each is one file of at most 8 KB in references/themes/ with a picture beside it; a build reads exactly one. See them all at usehallmark.com.

Custom

Say custom and Hallmark drops the themes: no plan, no components, no palette recipe, only the floor, the gates and a short direction in direction.md to find one idea that only this client has and let it run the page.

How a build runs

Pre-flight reads the project (fonts, palette, framework, a locked design.md) and asks once for the material: photos, screenshots, real numbers. Nothing is invented.
scripts/theme.mjs deal offers three themes that fit the prompt and clear the log; draw deals the page’s anatomy from its job.
The hero is built alone, rendered and reviewed cold before the rest of the page exists.
scripts/sloplint.mjs --render checks the page at eight widths, then a subagent reviews it with fresh eyes.

Each page is self-contained HTML and CSS, stamped in its first CSS comment with the decisions it took.

Redesign

Hallmark never starts on a design that already exists unless you name it:

1
2

/hallmark redesign ./src/app
/hallmark audit ./index.html

A full redesign keeps the content and the wiring and changes the system and the layout; say keep the layout for a restyle or polish for only the tells. sloplint --before records every link, field, handler and heading first, sloplint --kept fails the redesign if one went missing, and the handoff is a side-by-side before and after.

Install

`1`	`npx skills add nutlope/hallmark -g`

-g installs for every project; leave it off to install into the current one. Needs Node 18 or later. The browser checks (sloplint --render, screenshots) also need npm i -g puppeteer-core and Chrome; without them the static checks still run.

Harness	Lands in	Invoke
Claude Code	`~/.claude/skills/hallmark`	`/hallmark <prompt>` or describe a new build
Codex CLI	`~/.agents/skills/hallmark`	`$hallmark <prompt>` or describe a new build
Cursor	finds the copies above	`/hallmark <prompt>` or describe a new build
OpenCode	finds the copies above	`/hallmark <prompt>` or describe a new build

One harness only: npx skills add nutlope/hallmark -g --agent claude-code (or codex, opencode, cursor, github-copilot).
As a Claude Code plugin: /plugin marketplace add nutlope/hallmark, then /plugin install hallmark@hallmark (invoked as /hallmark:hallmark).
From a clone: node skills/hallmark/scripts/install.mjs validates every theme and reference before it copies; install-hook.mjs adds an edit-time Floor check to Claude Code.
Lint any page: node skills/hallmark/scripts/sloplint.mjs <file-or-dir> --render.
If it does not fire on its own, name it: use hallmark to build ….

Licence

MIT. Use it, fork it, ship it.

The photo library (skills/hallmark/scripts/photos.json) lists photographs hosted on Wikimedia Commons and holds no image files. Each keeps its own licence (CC0, public domain, CC BY or CC BY-SA), and Hallmark credits every one it uses on the page. It does not use stock sites (Unsplash, Pexels, Pixabay), whose terms bar AI tools from picking their images.

Automated Linting on Producthunt daily