UI 生成は「トークン名」より「使用例」を見せる（golden set）
LLM に --primary のようなデザイントークンや props の一覧だけ渡しても意味が伝わらない。<button className="bg-primary"> やフォーム内の submit ボタンの実例を「お手本集（golden set）」として渡すと、使い方の文脈ごと学ぶ。
どんな時に使う？
- デザインシステムがあるのに、エージェントが独自のスタイルで UI を作る
- コンポーネントの使い分け（primary / secondary 等）が守られない
手順
- よく使う UI パターンの実例コード集を用意（フォーム、ダイアログ、テーブル…）
- エージェントが検索して必要なものだけ文脈に入れられるようにする
- shadcn の場合: registry にお手本を置き、shadcn CLI＋スキルで検索・取得。複数 registry（自社＋OSS）を併用可能
- 自前なら
examples/ディレクトリ＋「UI を作る前に examples/ から近い例を探して」と AGENTS.md に書く
- 生成後、お手本との差分をレビュー観点にする
注意点
- トークン一覧の説明文を長々と CLAUDE.md に書くより、例を数個置く方が効く。
- MCP でデザインシステムを参照させる方法もある（例: relay のデザインシステムは MCP サーバーを公開）。