Generate non-templated UI with anti-slop design rules

Hallmark is a design skill for Claude Code, Cursor, and Codex built to refuse the on-distribution visual defaults every LLM was trained into - two pages generated for two different briefs feel like different sites, not colour-swapped versions of the same template. It picks a macrostructure for the brief, dresses it in one of twenty catalog themes, or switches to a from-scratch Custom mode when a brief's creative intent doesn't fit any of them with the same palette, type, and layout craft and no template underneath, runs fifty-seven slop-test gates plus a pre-emit self-critique, and outputs self-contained HTML and CSS stamped with its own macrostructure in a CSS comment. It exposes four verbs: the default build mode, which picks a macrostructure, applies the rule-set, and runs the slop test before handing the result back; hallmark audit <target>, which scores existing code against the anti-pattern catalog and returns a punch list with no edits made; hallmark redesign <target>, which throws out the existing structure while keeping copy, information architecture, and brand, then rebuilds with a different structural fingerprint; and hallmark study <screenshot|URL>, which extracts the "DNA" of an admired design - macrostructure, type-pairing, colour anchor - while explicitly refusing to produce pixel-clones or reproduce paid templates, optionally emitting a portable design.md for handoff to other AI tools.

Use it when generating new UI, auditing existing code for generic-AI design patterns, redesigning a page's structure while keeping its content and brand, or extracting the design language from a reference screenshot or URL. hallmark study is bounded by design: it will not produce a pixel-clone of the reference or reproduce a paid template, only the underlying structural and stylistic DNA. Custom mode stays a quiet branch that vanilla briefs never trigger - it only activates when a brief carries creative intent no catalog theme fits.

Input is a design brief, or for study, a screenshot or URL, plus the chosen verb; output for the default and redesign verbs is self-contained HTML plus CSS with the chosen macrostructure recorded in a CSS comment, having passed the 57 slop-test gates and a pre-emit self-critique; output for audit is a punch list scoring existing code against the anti-pattern catalog, with no edits applied; output for study is the extracted design DNA, optionally as a portable design.md file. Twenty catalog themes plus the Custom fallback are demonstrated across many worked example briefs on usehallmark.com and under site/_tests/, spanning a sourdough app, a content-extraction API, a record label, an AI reasoning tool, a tea menu, a honey farm, a risograph print fair, a type studio, and several SaaS, travel, fashion, and dev-infrastructure sites.

Installs via npx skills add nutlope/hallmark, re-runnable to update, or by copying SKILL.md and references/ directly into an agent's skill directory: ~/.claude/skills/hallmark/ for Claude Code, .cursor/rules/hallmark.mdc (the body of SKILL.md without frontmatter) for Cursor, or ~/.codex/skills/hallmark/ (personal) or .codex/skills/hallmark/ (project-scoped) for Codex. The full rule-set lives in SKILL.md and references/, with the Custom-mode protocol specifically in references/custom-theme.md and worked examples in docs/recipes.md and docs/study-examples.md.

Developers using an AI coding agent to generate or redesign web UI who want it to stop defaulting to the same generic AI-generated look across every brief, and who want a way to audit existing pages against that anti-pattern catalog or extract a reference design's underlying structure without cloning it outright. Made by Together AI and MIT licensed.