AI News Daily한국어
← AI tool tips
Claude Code✓ Confirmed in official docsAdded Oct 25

How to install the Hallmark 2.0 design skill in Claude Code and Codex to build pages that don't look AI-made

Hallmark is a design skill from Together AI. It opens the web pages your agent builds in a browser and lints them for the tells that read as machine-made (a small eyebrow above every heading, tracked-capital labels, one coloured word in a headline). Version 2.0.0, released October 21, adds forty-eight themes plus commands to redesign or audit an existing page, and it can now be installed as a Claude Code plugin.

  1. Install it for every project. Node 18 or later is required.
npx skills add nutlope/hallmark -g

Leave off -g to install into the current project only. To install for one tool only, add --agent claude-code (or codex, cursor, opencode, github-copilot).

  1. Or install it as a Claude Code plugin. In that case invoke it as /hallmark:hallmark.
/plugin marketplace add nutlope/hallmark
/plugin install hallmark@hallmark
  1. Invoke it when building a new page: /hallmark <prompt> in Claude Code, $hallmark <prompt> in Codex CLI. If it doesn't fire on its own, name it in the request, as in "use hallmark to build ...".

  2. Hallmark only touches an existing page when you point a command at it. Use redesign to rebuild it, or audit to get a report without changes.

/hallmark redesign ./src/app
/hallmark audit ./index.html

redesign keeps the content and wiring (links, fields, handlers) and changes the design system and layout. Add "keep the layout" to keep the layout too, or "polish" to remove only the tells.

The browser checks at eight widths (sloplint --render) and screenshots need npm i -g puppeteer-core and Chrome; without them only the static checks run. It's MIT-licensed.

Get notified when a new tip lands

Tip alerts only go out in the app. Install it and turn notifications on.

Get the app

All tips →