フォントの組み合わせをClaude Designで指定するコツ——毎回「なんか合わない」を卒業する

フォントの組み合わせは、Claude Designで最も「なんか違う」が出やすい領域のひとつだと思っている。色は「#E63946」と書けばほぼ一発で決まるのに、フォントだけは「おしゃれな感じで」と書いたら毎回まったく違うものが出てくる。

半年くらい試行錯誤して、ようやく再現性のある指定方法が固まってきた。

フォントを「2段階」で指定するのが基本

Claude Designにフォントを任せると、見出しと本文が同じ書体になることが多い。それだと全体がのっぺりして見える。最初から「見出し用」「本文用」を分けて指定するのが前提になる。

見出し: Inter Bold（サンセリフ、幾何学的）
本文: Lora Regular（セリフ、古典的）

このように「書体名＋スタイル名＋特徴の一言」をセットで渡すと、意図が伝わりやすい。書体名だけ渡すと、Claudeが「Bold指定なのにRegularで出す」という謎の解釈をすることがある。

※Claude Design: Anthropic Labsが開発したAIビジュアルデザインツール。テキストプロンプトからUI・スライド・マーケ資料などを生成する。

日本語が入るデザインで必ずハマる罠

英語フォントだけ指定して日本語が混在するデザインを作ると、高確率でフォントが崩れる。Claude Designは欧文フォントを指定すると日本語部分を「游ゴシック」や「Noto Sans JP」で補完するのだが、この組み合わせが意図と合わないケースが多い。

実際にやらかした例がこれ。

「見出しはPlayfair Display、本文はSource Sansでテック系のLPを作って」

結果：英語部分はきれいなのに、日本語説明文だけ游ゴシックの細めのウェイトになって全体が浮いた。

対策は、日本語フォントもセットで明示すること。

欧文見出し: Playfair Display Bold
日本語見出し: Noto Serif JP Bold
欧文本文: Source Sans 3 Regular
日本語本文: Noto Sans JP Regular

※ 欧文と和文でセリフ系・サンセリフ系を統一すること

「欧文と和文でセリフ系・サンセリフ系を統一すること」この一文を追加するだけで、崩れがかなり減った。

※LP: ランディングページの略。特定のCTAに向けて設計されたWebページ。

実際に使っているプロンプトフォーマット

ブランドトーン別にテンプレートを3つ持っている。

テック・スタートアップ系

フォント: Inter（見出し: 700, 本文: 400）× Noto Sans JP
モノスペースが出る場合: JetBrains Mono

ラグジュアリー・高単価系

フォント: Cormorant Garamond（見出し: Light Italic）× Noto Serif JP
本文: Jost Regular × Noto Sans JP Light

親しみやすいサービス系

フォント: Nunito（見出し: 800, 本文: 500）× M PLUS Rounded 1c

このテンプレートをそのままコピーして、色・サイズ指示と組み合わせて渡している。毎回ゼロから考えるより、このフォーマットに「あなたのブランドカラーと要件」を足す方が断然早い。

※プロンプト: AIへの指示文。Claude Designでは自然言語でデザインを指示する。

うまくいかないときの確認ポイント

フォント指定が反映されない、または変な組み合わせになる場合、以下を順番に確認している。

1. Googleフォントか確認する — Claude Designは基本的にGoogleフォントしか扱えないと思った方がいい。有料フォントを指定しても黙って別のものに置き換えられる
2. ウェイト名を明示する — 「Bold」だけでなく「700」のように数値で補完すると通りやすい
3. 「似た雰囲気のフォントに変えてよい」と書かない — この一文があるとClaude側の自由度が上がりすぎて毎回別物になる

フォントは一度テンプレートを固めてしまえば、その後は「前回と同じフォント設定で」と書くだけで再現できる。最初の3回はちゃんと指定して、4回目以降は楽をする——これが今のやり方。