Hallmark: Anti-AI-Slop Design for Claude, Cursor & Codex
/hallmark
Hallmark loads into Claude Code, Cursor, or Codex to run your UI brief through 57 anti-pattern checks before handing back code. Reach for it if you're on one of those three tools and tired of the gradient-hero template look. Skip it if you use a different AI tool, need pixel-perfect reproduction (study mode refuses that), or want output you can verify independently.
The problem it solves
Mainstream coding LLMs were trained on overlapping web data, so they reach for the same defaults when asked to build a landing page — the blue-to-purple gradient hero, the rounded feature-card grid, the same font pairing. Two unrelated products built by two different teams with AI assistants can end up looking like reskins of the same template. Hallmark's explicit goal: two pages from different briefs should look genuinely distinct, not like variations of the same layout.
What is it?
Hallmark is a prompt-and-reference package (SKILL.md + references/) that Claude Code, Cursor, and Codex load before generating UI. It gives the model a macrostructure-selection process, one of twenty-one themes, and a checklist of 57 slop patterns to avoid — the on-distribution defaults every LLM was trained into. The model self-critiques against that checklist before handing back the page.
Why it's getting attention
Hallmark resonates because it names a complaint developers had already noticed: ask Claude Code or similar tools for a landing page and you get a recognizable house style. Together AI shipped a public gallery at usehallmark.com where you can cycle all twenty-one themes with the T key, giving people something shareable instead of taking a README's word for it. The skills distribution format adds zero friction — one npx command, no new tool, no account.
Key features
- ✓Four verbs: default build, `hallmark audit <target>` (scores existing code against anti-patterns, no edits), `hallmark redesign <target>` (new visual fingerprint, same copy and IA), `hallmark study <screenshot|URL>` (extracts design DNA, refuses pixel-clones)
- ✓57 slop-test gates plus a pre-emit self-critique pass run before any UI is handed back
- ✓Twenty-one built-in themes selected by macrostructure fit to the brief, browsable live at usehallmark.com (press T to cycle)
- ✓Custom mode builds a bespoke palette/type/layout from scratch when no catalog theme fits, still under the same 57 gates
- ✓`study` mode can output a portable design.md so extracted design language can be handed to other AI tools
- ✓Ships as SKILL.md + references/, installable with one `npx skills add` command across three assistants
Best use cases
- •Generating a first-draft SaaS landing page in Claude Code without landing on the default gradient-hero look
- •Running `hallmark audit` on an existing codebase before a client demo to surface AI-pattern tells in the punch list
- •Using `hallmark redesign` to give a dated internal dashboard a new visual fingerprint without touching its copy or information architecture
- •Extracting a colour/type/layout language from a screenshot of an admired site with `hallmark study`, without producing a pixel clone
- •Keeping visual output consistent when different team members use Claude Code, Cursor, and Codex on the same project
How to install / try
`npx skills add nutlope/hallmark` — re-run to update. No package.json entry and nothing to build; it drops SKILL.md and a references/ folder wherever your tool expects skills. Manual install: copy SKILL.md + references/ into Claude Code's ~/.claude/skills/hallmark/, Cursor's .cursor/rules/hallmark.mdc (body only, no frontmatter), or Codex's ~/.codex/skills/hallmark/ (personal) or .codex/skills/hallmark/ (project-scoped).
How to use
Describe the UI you want in your assistant and it builds by default, running the 57 slop-test gates before returning code. Or invoke one of the other three verbs directly: `hallmark audit <target>` scores existing code against the anti-pattern list without touching it; `hallmark redesign <target>` rebuilds a page's visuals while keeping its copy and structure; `hallmark study <screenshot|URL>` extracts the macrostructure, type-pairing, and colour anchor from a reference design. Exact invocation phrasing beyond those four verbs is not clearly documented — you're relying on the skill instructions the model reads, not a CLI you type into directly.
Strengths
- ✓Free and MIT-licensed with a one-command install; no API key or account to create
- ✓Names a real, specific problem — same-looking AI UI — rather than a generic AI-website-builder pitch
- ✓Four distinct verbs cover more of the workflow than a one-shot generator: build, audit, redesign, study
- ✓`study` mode has a stated ethical line: it refuses to pixel-clone or reproduce paid templates
- ✓Backed by Together AI, with a live gallery at usehallmark.com that demonstrates all twenty-one themes in action
Limitations & risks
- △Not a standalone app — there's nothing to run, test, or deploy on its own; it only functions inside Claude Code, Cursor, or Codex
- △Quality depends on the underlying model actually following the skill instructions consistently — the 57 gates are prompted checks, not an automated linter you can verify independently
- △The CSS language tag reflects example output rather than application code — Hallmark is a prompt-and-reference package, not a program you can run
- △No changelog or versioning for the twenty-one themes or gate list, so it's unclear how often anti-slop patterns get refreshed as underlying models evolve
- △Cursor's manual install requires stripping frontmatter from SKILL.md and pasting into a .mdc file — more steps than the one-line npx path for Claude Code
Alternatives
Who should try it — and who should skip
Install it if you're already generating front-end UI with Claude Code, Cursor, or Codex and can point to the exact "AI-slop" look you're tired of — gradient heroes, identical card grids, the same font pairing. Skip it if you use a different AI coding tool, need UI that matches an existing brand system exactly, or want deterministic, testable output rather than prompt-guided behavior that depends on the model following instructions.
Frequently asked questions
It's a design skill — a SKILL.md plus a references/ folder — that Claude Code, Cursor, and Codex load before generating UI, built by Together AI to stop AI-generated pages from all looking the same.
Yes. It's MIT-licensed and free; the only cost is whatever you already pay to run Claude Code, Cursor, or Codex.
It supports Cursor and Codex as well as Claude Code, each with its own install path. Outside those three tools it doesn't do anything — it's not a standalone app or a design system you can pull into a different stack.
No. `hallmark study <screenshot|URL>` extracts structural and stylistic patterns from a reference design, but the README explicitly states it refuses pixel-clones and paid templates.
Run `npx skills add nutlope/hallmark`, or copy SKILL.md and references/ manually into your tool's skill directory — the exact location differs for Claude Code, Cursor, and Codex.
Still deciding about hallmark?
One click hands the question to an AI along with this page — see what it says about hallmark.