Open-source project
Nutlope/hallmark avatar
Nutlope/hallmark

Hallmark: A Design Skill That Tries to Make AI Interfaces Stop Looking AI-Generated

Hallmark is a design-review skill that flags common AI-generated interface patterns and gives coding agents concrete replacement rules.

28,670 stars1,469 forksCSSMIT

At a glance

What is it?
Hallmark is a design-review skill for Claude Code, Cursor, and Codex that flags common AI-generated interface patterns and suggests concrete replacements. It is built around fifty-seven slop-test gates, four verbs, and twenty-one themes.
Who is it for?
Adopt Hallmark if you use Claude Code, Cursor, or Codex and want to reduce the telltale signs of AI-generated UI, especially for client-facing prototypes or marketing pages. Skip it if you need pixel-perfect replication of an existing design or if your workflow does not tolerate an agent rewriting structure.
Can I use it commercially?
Yes. MIT is a permissive licence: you can use, modify and sell software built on it, as long as you keep its copyright and licence notices.
Is it still maintained?
Yes. The repository last received commits 40 days ago.
What is it written in?
Mainly CSS, according to GitHub's language statistics.

Answers come from the project's GitHub data, last synced on September 15, 2026, and from our analysis. They are not legal advice.

DEEP OPEN-SOURCE ANALYSIS

What Hallmark Actually Solves

Hallmark addresses a specific annoyance: LLMs trained on the web tend to produce interfaces that share the same visual DNA. Centered hero sections, generic gradient buttons, and predictable card grids show up across projects. Hallmark is a design skill, not a library or a framework. It plugs into Claude Code, Cursor, and Codex and gives those agents a rule set to follow when building or reviewing UI. The README claims it refuses the on-distribution defaults every LLM was trained into. That is a strong claim, and the mechanism is a set of checks rather than a generative model. The intended user is a developer who uses an AI coding agent and cares about the visual outcome, not just the code.

The Four Verbs: Build, Audit, Redesign, Study

Hallmark exposes four operations. The default verb builds new UI: it picks a macrostructure, applies the rule set, and runs the slop test before handing back. The audit verb takes a target path and scores existing code against the anti-patterns, producing a punch list without making edits. The redesign verb throws out the structure but keeps copy, information architecture, and brand, then rebuilds with a different fingerprint. The study verb takes a screenshot or URL, extracts what the README calls the DNA of the design: macrostructure, type-pairing, colour anchor. It refuses to clone pixels or paid templates. Study can optionally emit a portable design.md for handoff to other AI tools. These four verbs cover the main workflows: generating, checking, reworking, and learning from reference designs.

Fifty-Seven Slop-Test Gates and Self-Critique

The core mechanism is a set of fifty-seven slop-test gates. The README does not list all gates, but it says every generated page runs through them, plus a pre-emit self-critique. The gates are checks for patterns that read as AI-generated, such as overused color schemes or generic typography. The self-critique happens before the skill hands the result back to the user. This is a rule-based approach, not a learned model. It means the effectiveness depends on the quality and coverage of those fifty-seven rules. The README claims that two pages by Hallmark for different briefs feel like different sites, not colour-swaps of the same template. That is a testable claim, and the site includes examples under site/_tests/ that you can inspect.

Twenty-One Themes and the Custom Branch

Hallmark comes with twenty-one themes. Each theme is a named combination of macrostructure, type, and colour. Examples include Bubble for a sourdough app, Distil for an extraction API, Cold Snap for a record label, and Cinder for an AI tool. The themes are not templates in the usual sense; the README stresses that the skill picks the theme and structure to fit each brief. When a brief carries creative intent that no catalog theme fits, Hallmark switches to Custom mode. In Custom mode, it designs the page from scratch with a made-to-measure palette, type, and layout, still running the same fifty-seven gates. The README says Custom is a quiet branch and vanilla briefs never see it. The protocol lives in custom-theme.md. This design means most outputs will look like variations of the twenty-one themes, and only unusual briefs get the full custom treatment.

Installation and File Layout

Installation is straightforward. The README gives the command npx skills add nutlope/hallmark. Re-running that command updates the skill. Alternatively, you can copy SKILL.md and the references/ directory into the appropriate location for each agent. For Claude Code, that is ~/.claude/skills/hallmark/. For Cursor, you put the body of SKILL.md into .cursor/rules/hallmark.mdc without frontmatter. For Codex, the paths are ~/.codex/skills/hallmark/ for personal use and .codex/skills/hallmark/ for project-scoped use. The rule set lives in SKILL.md and references/, and worked examples are in docs/recipes.md and docs/study-examples.md. The repository is primarily CSS, which suggests the themes and examples are hand-crafted HTML and CSS files. The README mentions that each example page is self-contained HTML and CSS with its macrostructure stamped in a CSS comment.

Limitations and Failure Modes

The most obvious limitation is that Hallmark is a skill, not a design system. It depends on the coding agent following the instructions in SKILL.md. If your agent ignores the rule set, the gates do nothing. The fifty-seven gates are a fixed list; they cannot catch every possible AI-generated pattern, and the README does not document what those gates are. That makes it hard to evaluate coverage before adopting. Another limitation is that the audit verb produces a punch list with no edits, so you still have to apply the changes yourself or ask the agent to do it. The redesign verb throws out the structure, which is risky if you have a layout that works well but looks generic. The study verb refuses pixel-clones, so you cannot use it to replicate a specific design you like. For teams that need strict brand compliance, the twenty-one themes may not match their visual identity, and Custom mode only activates for briefs with creative intent.

Alternatives and Comparisons

A direct alternative is to write your own design rules for your coding agent. Instead of using Hallmark's fifty-seven gates, you could define a set of anti-patterns specific to your product's visual language. That approach gives you full control but requires ongoing maintenance. Another alternative is to use a traditional design review tool that runs on screenshots, such as a visual regression tool or a design linting service. Those tools compare against a baseline or a set of design tokens, whereas Hallmark works at the code level and can suggest structural changes. The key difference is that Hallmark is embedded in the coding agent's workflow, so it can influence generation before the code exists, not just review the final output. If you already have a design system, a tool that validates against your tokens might be more precise than Hallmark's generic anti-patterns.

Maintenance and Licence Considerations

The repository is MIT-licensed, which means you can use, fork, and modify it freely. The README says re-run the install command to update, but there have been no recent releases retrieved, so the update path is unclear. The last push is unknown, which makes it hard to assess how actively maintained the project is. The rule set is plain text in SKILL.md and references/, so you can inspect and edit it without compiling anything. That is a maintenance advantage: you can add or remove gates as you see fit. The downside is that if the upstream project stops updating, you are responsible for keeping the rules relevant as AI models change their default output patterns. The dependency on npx skills add suggests the project is distributed through a skills registry, but the README does not specify how that registry is updated or versioned.

Editorial conclusion

Adopt Hallmark if you use Claude Code, Cursor, or Codex and want to reduce the telltale signs of AI-generated UI, especially for client-facing prototypes or marketing pages. Skip it if you need pixel-perfect replication of an existing design or if your workflow does not tolerate an agent rewriting structure. Before adopting, verify that the skill's four verbs match how you work, and test the audit mode on a small existing codebase to see if the punch list is actionable. The project is MIT-licensed, so you can fork and adjust the rule set, but the maintenance cost is on you.

Official sources

  1. Official documentation
  2. Official README
  3. Project repository
Community notes

Community notes