Favicon of Hallmark

Hallmark

Hallmark is an MIT-licensed design skill for Claude Code, Cursor, and Codex that blocks generic AI-generated UI patterns.

Hallmark website screenshot
Hallmark GitHub repository preview

Hallmark is a design skill you install into Claude Code, Cursor, or Codex to stop these tools from producing the same generic, template-looking UI every LLM defaults to. It's built for developers and designers who use AI coding assistants to build web UI but are tired of getting the same colour-swapped hero sections, the same font pairings, and the same layout shapes on every project. Made by Together AI, it works by picking a macrostructure for the brief, applying one of twenty-one visual themes, and running a set of anti-pattern checks before handing back any output.

Instead of a single template with swappable colours, Hallmark treats each brief as its own design problem. It selects a structure, a type pairing, and a colour system based on what the brief actually calls for, then checks the result against a list of known AI-slop patterns before it ships. Two different briefs run through Hallmark should produce two pages that don't look like variations of the same site.

Key features

  • Four verbs: default build mode creates new UI from a brief; audit scores existing code against anti-patterns without editing anything; redesign keeps copy, IA, and brand but rebuilds the structure; study extracts design DNA (macrostructure, type pairing, colour anchor) from a screenshot or URL you admire.
  • 57 slop-test gates: a checklist of known AI-generated design tells that the skill runs against before returning output, plus a pre-emit self-critique pass.
  • 21 catalog themes: a range of visual directions the skill can pick from depending on the brief, rather than one default look.
  • Custom mode: when a brief has creative intent that doesn't fit any catalog theme, Hallmark designs a page from scratch with its own palette, type, and layout, still passing the same 57 gates.
  • Portable design.md output: the study verb can emit a design spec file for handoff to other AI tools, so extracted DNA isn't locked into one assistant.
  • Self-contained output: generated pages are plain HTML + CSS, each stamped with its macrostructure in a CSS comment, making it easy to inspect what structure was chosen.

Ideal use cases

Hallmark fits well if you're prototyping marketing sites, landing pages, or product pages with an AI coding assistant and want variety instead of the same three layout shapes every time. It's useful for agencies or freelancers generating multiple client sites who need each one to feel distinct rather than templated. The audit verb is handy for reviewing AI-generated code you already have and getting a punch list of slop patterns to fix, without Hallmark touching the code itself.

It's not a fit if you need a full design system, component library, or ongoing design tooling: Hallmark is a skill file that shapes how an AI assistant generates UI, not a framework or runtime. It also won't help if you need pixel-perfect clones of existing designs or paid templates; the study verb explicitly refuses to clone designs, it only extracts general patterns. If your workflow doesn't involve Claude Code, Cursor, or Codex, there's nothing here to install since Hallmark is delivered as a skill/rules file for those specific tools.

Installation

The simplest install is via the skills CLI, which works across supported tools:

npx skills add nutlope/hallmark

Re-run that command any time to pull updates. Alternatively, copy SKILL.md and the references/ directory manually into the right location for your tool:

  • Claude Code: place files in ~/.claude/skills/hallmark/
  • Cursor: put the body of SKILL.md (no frontmatter) into .cursor/rules/hallmark.mdc
  • Codex: place files in ~/.codex/skills/hallmark/ for personal use, or .codex/skills/hallmark/ for project-scoped use

The rule-set itself lives in SKILL.md and the references/ folder in the repo. Worked examples are documented in docs/recipes.md and docs/study-examples.md, and generated example pages live under site/_tests/ or can be browsed live at usehallmark.com.

Frequently asked questions

Share:

Stars
27K
Forks
1.4K
Last commit
20 days ago
Repository age
4 months
License
MIT
Self-hosted
No
Activity score
82/100
View Repository
Ad
Favicon

 

  
 

Similar to Hallmark

Favicon

 

  
 
Favicon

 

  
 
Favicon