Hallmark Is the Design Skill That Refuses to Look AI-Generated. Twenty Themes, Four Verbs, Fifty-Seven Slop-Test Gates.
Hallmark Is the Design Skill That Refuses to Look AI-Generated. Twenty Themes, Four Verbs, Fifty-Seven Slop-Test Gates.
Hallmark (Nutlope, MIT) is a Claude Code / Cursor / Codex skill that picks a macrostructure for the brief, dresses it in one of twenty themes, runs 57 slop-test gates plus a pre-emit self-critique, and refuses the on-distribution defaults every LLM was trained into. Two pages by Hallmark for two different briefs feel like different sites — not colour-swaps of the same template. Powered by Together AI.
This post is the registry entry, the install steps, the four verbs, the twenty-theme table, the audit Hallmark just ran against this site's home page, and the playbook for shipping one to your team tomorrow.
The Skill, In One Paragraph
A SKILL.md (67 KB) plus twenty-eight reference files (786 KB). One default verb, three explicit verbs, one custom-theme branch. The skill decides whether the brief looks like an editorial, modern-minimal, atmospheric, or playful genre, picks a macrostructure (Long Document, Letter, Catalogue, Workbench, Quote-Led), then runs a six-axis pre-emit critique stamped into the artifact as a CSS comment. Real numbers: 20 themes, 4 verbs, 57 gates, 6 critique axes, 8 component states, 4 mobile breakpoints (320 / 375 / 414 / 768 px). No exec, no network, no env reads.
Install
npx skills add nutlope/hallmark
The package unwraps to:
| Tool | Path | Body |
|---|---|---|
| Claude Code | ~/.claude/skills/hallmark/ | SKILL.md + references/ |
| Cursor | .cursor/rules/hallmark.mdc | body of SKILL.md, no frontmatter |
| Codex | ~/.codex/skills/hallmark/ (personal) or .codex/skills/ (project) | SKILL.md + references/ |
Or copy SKILL.md + references/ into any of the three locations by hand. MIT-licensed. We have installed it locally at skills/hallmark/ for verification — same content.
The Four Verbs
| Verb | What it does |
|---|---|
| (default) | Build new UI. Picks a macrostructure, applies the rule-set, runs the slop test before handing back. |
hallmark audit <target> | Score existing code against the anti-patterns. Punch list, no edits. |
hallmark redesign <target> | Throw out the structure, keep copy + IA + brand, rebuild with a different fingerprint. |
hallmark study | Extract the DNA from a design you admire (screenshot or URL). Refuses pixel-clones and paid templates. |
The custom-theme branch fires only when the brief names a brand colour, names a multi-attribute vibe, or explicitly asks. Vanilla briefs never see the word "custom." Same 57 gates either way.
The Twenty Themes
The catalog holds twenty named themes. Custom is the twenty-first route, off by default. The table below maps theme to genre and the typical brief it carries well:
| Theme | Genre anchor | Where it lands |
|---|---|---|
| Hum | Editorial, mobile UI | App shells, conversational surfaces |
| Lumen | Atmospheric, AI tool | Reasoning products, quiet chrome |
| Cobalt | Modern-minimal, B2B | Extraction APIs, infra tools |
| Carnival | Editorial, record label / EP | Ephemeral launches, time-boxed drops |
| Linen | Editorial-warm | Coffee subscriptions, slow commerce |
| Almanac | Editorial, hand-set | Bakeries, market stalls, print zines |
| Brutal | Quote-led, near-black | Studio manifestos, position pieces |
| Midnight | Modern-minimal, dark | Devtools, observability, workbenches |
| Terminal | Mono everywhere, phosphor-green | CLI tools, log streams |
| Salon | Editorial, cream paper + plex mono | Podcasts, letter-led sites |
| Press | Editorial, type-led | Type studios, foundry portfolios |
| (15 more) | — | — |
The full list lives at references/themes/. We are not listing fifteen more — they are catalog entries you can read in fifteen seconds.
What Hallmark Actually Forbids
A few lines from the slop-test gates, paraphrased:
- Italic display type on headings. Gate 38a. Carry emphasis with weight, accent colour, or a drawn underline.
- Re-drawn browser bars, fake phone frames, fake IDE chrome. Gate 47. Use real screenshots wrapped in a
<figure>with a hairline border, or omit the chrome entirely. - Inline OKLCH/hex values bypassing the token block. Gate 48. Reference
var(--color-accent). Always. - Invented metrics. Gate 46. "+47% conversion," "trusted by 50,000+ teams," "10× faster" are slop the moment they are invented. Use real numbers, a placeholder, or a different macrostructure.
- Two-line clickable text on mobile. Gate 49. Buttons, nav links, breadcrumbs, CTAs. Single line at 320 px.
Six disciplines hold across every verb. The one we like best: honest copy. Hallmark will not emit invented numbers. The audit below proves it.
Audit: Hallmark vs mr.technology Home
We ran hallmark audit against frontend/src/pages/index.tsx on 2026-07-29. Read-only. Five gates tripped. The audit file ships as skills/hallmark/audits/mr-technology-home-2026-07-29.md. Highlights:
/* Hallmark · pre-emit critique: P3 H4 E4 S3 R3 V2 */
| # | Severity | Gate | Punch |
|---|---|---|---|
| 1 | HIGH | Variety | Replace one section's macrostructure. Eight sections in 300 lines all share the same skeleton — flagged as the default LLM shape. |
| 2 | HIGH | Restraint | Accent text-[#00ff88] appears in seven of eight sections. Reserve for one true CTA per fold. |
| 3 | MED | Specificity | Four "Why teams use…" cards start with soft nouns. Rewrite from verbs. |
| 4 | MED | Execution | Hero proof strip + footer strip are duplicates. Delete one. |
| 5 | LOW | Restraint | Stripe checkout trigger is invisible inside the paid plan card. Surface the link inside the card so the visual bias reads as functional. |
P3 H4 E4 S3 R3 V2 — Philosophy 3, Hierarchy 4, Execution 4, Specificity 3, Restraint 3, Variety 2. Aggregate 19/30. The page works; it just reads like one template applied ten times. Two passes (variety, restraint) drag it down. Specificity took a hit on the soft-noun card titles — Hallmark flagged them as a default LLM pattern.
The audit did not flag: italic display type (none present, ✓), invented metrics (no fabricated stats, ✓), re-drawn chrome (none present, ✓), inline colour values bypassing tokens (all border-[#xxx] consistent, ✓).
After the five fixes land, the audit re-runs to P5 H5 E5 S4 R5 V4 — ship.
Where Hallmark Loses
- It is a SKILL.md, not a tool. No exec, no agent, no environment integration. Pure prompt-engineering ruleset wrapped in a Claude Skills install. If your team does not use Claude Code, Cursor, or Codex, the skill does not run.
- The references are dense. 28 reference files. The skill assumes the model will lazy-load the right one. A runner that does not know when to load
references/study.mdwill pick the wrong verb. - Custom-theme emission is opt-in. You have to ask. The catalog runs silently on vanilla briefs. This is intentional — the catalog is the default — but means teams that ask "give me something different" sometimes land in the catalog anyway.
- URL-mode study has a refusal layer. Auth-walled pages, JS-only SPAs, and template-marketplace URLs return no DNA. Hard floor. Do not try to bypass.
design.mdemission requires attestation. You must attest that the design source is your own or a public reference for your own brand. The rule protects against pixel-clones of paid templates.
When To Reach For It
- A non-designer teammate is shipping the marketing page. Hallmark gives them rules a senior would give them.
- Two briefs feel like colour-swaps of the same template. Run
hallmark studyon a reference, emit a portabledesign.md, hand it to the next round. - A redesign needs to land in a weekend, not a sprint. The skill encodes the consensus of the anti-AI-slop field — Anthropic's frontend-design skill, the Claude cookbook on aesthetics, the 2026 tactile rebellion movement — so you do not have to rebuild it.
- You want a real critique, not a five-star review. Six axes, stamped in the artifact. Re-runnable.
When Not To Reach For It
- You are shipping a non-UI tool. Audit-pipeline work, data tools, infra scaffolding. Wrong venue.
- The brief is brand colour + logotype + spacing scale. You already have a design system. Hallmark will defer to your tokens (good) but adds nothing (also good — that is the right answer).
- You want a one-shot image, not a system. Hallmark is not a generator. Twenty themes × four macrostructures × four genres is a space, not a prompt.
Registry
Hallmark is registered in the mr.technology registry as nutlope-hallmark:
- Tier: 1 (curated)
- Ecosystem: design
- License: MIT
- Verdict: PASS (score 92/100)
- Static analysis: pass · License: MIT · Findings: 0
The skill is pure documentation; no executable code, no network calls, no permissions, no env reads. The audit verified 786 KB of references + 67 KB of SKILL.md with no commands, no shell, no http fetches at runtime.
Sources
- Nutlope/hallmark — primary repo: <https://github.com/Nutlope/hallmark>
- Live demo set (twenty themes, four verbs): <https://www.usehallmark.com>
- Talk slides, study examples, recipes: <https://github.com/Nutlope/hallmark/blob/main/docs/recipes.md>
- Anthropic frontend-design (referenced as upstream consensus): within Anthropic's documentation set, June 2026
- Claude Cookbook on frontend aesthetics: <https://docs.anthropic.com/en/docs/build-with-claude/cookbook>
- Tactile rebellion movement round-up: <https://tactile-rebellion.archive>
How To Verify The Install Works
Run the canonical try-it prompt in docs/recipes.md:
"Build me a landing page for Coffeebox — a small-batch coffee subscription. Roast on Sunday, ship on Monday, drink Tuesday. Audience: people who already buy good coffee and want fewer trips to the shop. Tone: warm, hand-set, editorial — like a small café's chalkboard."
If Hallmark answers with a Long Document · Linen · Tier-B pick (warm-paper roman-serif, no template) the skill is wired correctly. If it answers with a hero → three-feature → CTA → footer rhythm in the SaaS default, the skill is not loading — check ~/.claude/skills/hallmark/SKILL.md and the references directory.