Hallmarkスキルで「作る・採点・作り直し・好きなサイトから抽出」を使い分け、AIっぽくないUIにする

Together AIが公開したClaude Code・Cursor・Codex用のデザインスキル。依頼ごとにページの骨格（マクロ構造）とテーマを選び、57項目の「AIっぽさ」チェックを通してから返す。既存コードの採点だけ、構造ごとの作り直し、参考サイトからの「DNA」抽出（design.md出力）もできる。

どんな問題を解決するか / いつ使うか

エージェントに作らせたLPが、どの案件でも同じテンプレートの色違いになる問題に効く。新規作成だけでなく、すでにあるページを「直さずに点検だけ」したいときや、好きなサイトの雰囲気を丸写しせずに取り込みたいときにも使える。

やり方

導入：npx skills add nutlope/hallmark（再実行で更新）。手動なら SKILL.md と references/ を次へ置く。
- Claude Code: ~/.claude/skills/hallmark/
- Cursor: .cursor/rules/hallmark.mdc（SKILL.mdの本文のみ、frontmatterなし）
- Codex: ~/.codex/skills/hallmark/ またはプロジェクトの .codex/skills/hallmark/
4つの使い方：
| 指示 | 何をするか |
|---|---|
| （そのまま依頼） | 新しいUIを作る。骨格を選び、ルールを当て、AIっぽさのチェックをしてから返す |
| hallmark audit <対象> | 既存コードを禁止パターンで採点し、直す項目の一覧を出す（編集しない） |
| hallmark redesign <対象> | 文言・情報設計・ブランドは残し、構造を捨てて別の骨格で作り直す |
| hallmark study <スクショかURL> | 好きなデザインから骨格・書体の組み合わせ・基準色を抽出。ピクセル単位の模倣や有料テンプレートの複製は断る。必要なら他のAIツールに渡せる design.md を出力 |
どのテーマにも合わない依頼では「Custom」に切り替え、配色・書体・レイアウトをゼロから作る（チェック項目は同じ）。

注意点

21のテーマと骨格の組み合わせなので、ブランドが固まっている案件では、自分のDESIGN.mdを優先させ、Hallmarkは audit だけ使う、という分け方もできる。
study の design.md は、好きなサイトのスクショ3〜5枚をエージェントに分析させ、選んだ要素だけをDESIGN.mdにするの流れをスキル側でやってくれるもの。
同系統のスキル：デザイン用スキル＋決まったルールで検出する仕組みで「AIっぽいUI」を潰す（Impeccable等）、バイブコーディングしたサイトは、taste-skill v2 で「AIっぽさの印」を幅ごとに洗い出してから直す。複数入れると指示が競合することがあるので、プロジェクトごとに1つに絞るのが無難。

出典

紹介投稿: @RizeOnline · 2026-10-19
リポジトリ: github.com/nutlope/hallmark（READMEで内容を確認、MITライセンス）／デモ usehallmark.com
収集日: 2026-10-19（JST）