Claude Code、Cursor、Codex向けに配布されるデザインSkill。AIにUIを書かせるとどうしても出てくる「AI生成っぽい見た目」を、ひとつのルールセットで防ぎにいく。
4つの機能
Build(デフォルト) — 直近よくある3つのマクロ構造を避けながら新しいページを生成する
Study — スクリーンショットやURLから構造的なDNAを抜き、design.md として持ち運べる仕様に落とす(ピクセルコピーはしない)
Audit — アンチパターン辞書と突き合わせてデザインの問題点を診断する
Redesign — 既存コンテンツを別の構造アプローチで組み直す
排除している5つのアンチパターン
- 紫→ピンクのグラデーションヒーロー + 中央寄せ白文字
- Inter / Roboto / Open Sans を見出しにも本文にも使う
- 全体センター揃え(対称を初期値にする)
- 角丸長方形にアイコンを並べたフィーチャーカード
- 「左ワードマーク + 中央リンク + 右CTA」の定型ナビ
8つの基盤ルール
書体ペアリング、OKLCHカラーパレット、4px倍数のスペーシング、指数的なease-outモーション、テーマごとに違うボイス、非対称レイアウト、可読な階層、抑制を優先する設計。
インストール
npx skills add nutlope/hallmark
Claude Codeなら ~/.claude/skills/hallmark/ 、Cursorなら .cursor/rules/hallmark.mdc に自動配置される。Together AIが提供。AIにUIを書かせる前提のチームで、アウトプットの平均点を底上げしたいときの土台になる。