ロゴデザイン · 実測
AI のロゴの色がずれる？ブランドの正確なカラーコードを取り戻す方法
ブランドの二色をカラーコードで画像モデルに伝えると、ロゴは正しく見えます。ところが印刷会社の校正刷りでは色が少しずれていたり、看板の緑がウェブサイトの緑と合わなかったりします。
2026年9月27日、架空のボードゲームカフェ Rook & Rabbit のロゴを Ciyo で四つ作り、すべてのピクセルを測定しました。わかったことと、頼んだ二色だけのファイルにたどり着いた二段階の修正を紹介します。
依頼の内容: 二色、正確なコード
GPT Image 2.5 Flare に四つの版を一度に頼みました（1:1、1K、画像 4 枚、8 クレジット）。プロンプトでは、二行の文字、マーク、そしてちょうど二つの色、深緑 #1F4D3A とクリーム色 #F3E9D2 を指定しました。
ボードゲームカフェのための、平塗りのベクター風ロゴ。一行目には正確に "Rook & Rabbit"、二行目には小さな大文字で "GAME CAFÉ · EST. 2026" と入れてください。名前の上には、チェスのルークの上からウサギの耳が立ち上がるシンプルなマークを置いてください。色は深緑 #1F4D3A とクリーム色 #F3E9D2 の二色だけにし、背景は無地のクリーム色にしてください。中央に配置し、余白はたっぷり取り、モックアップやほかの文字は入れないでください。綴りは正しかった。色は正しくなかった
四つのロゴはどれも “Rook & Rabbit” と “GAME CAFÉ · EST. 2026” をアクセント記号まで正しく綴っていました。目で見る限り、二色のロゴでした。
ファイルが示した事実は違いました。どのファイルにも 14,986 から 17,288 色が含まれていました。縁はぼやけ、背景にはかすかな質感があり、緑はロゴごとに少しずつ異なります。どちらかのカラーコードに正確に一致したピクセルは 3% 未満でした。
わずかなずれが問題になる理由
#1F4D3A と #174234 は、スマートフォンでは同じに見えます。しかし印刷したメニュー、看板、ウェブサイトを並べると、同じには見えません。印刷会社や看板業者はファイルの中の数値に合わせるので、その数値はブランドのものでなければなりません。
背景のかすかな質感には、もう一つの代償があります。一色の平塗りになっていないクリーム色は、少しむらのある面として印刷され、きれいにベクタートレースするのも難しくなります。
2026-09-21に投稿。この投稿は、生成画像の中の物体に正確なカラーコードを割り当てられるようにすることを目指す研究論文 Paint-Anything を要約し、FLUX モデルで色の忠実度が大きく向上したと伝えています。私たちはその数値を検証していません。この投稿は、ふだん使う画像モデルでは正確な色がまだ解決されていないことを示すものとして役に立ちます。これは私たちの測定結果とも一致します。
手順 1: いちばん良い版をベクターにする
描き方がいちばん良いロゴを選んで選択し、画像ツールバーで More（その他）→ Vector（ベクター化）を開きます。私たちの実行では約 10 秒、2 クレジットかかり、元の画像の横に SVG が置かれました。
SVG にはパスが 52 個あり、塗りは三つだけでした。クリーム色が #F4EBD2、緑が #1F4A37、そしてはぐれたパスが一つだけ #2F523F です。ここが役に立つ点で、何千もあった色が三つになりました。
手順 2: 塗りを正確なコードに置き換える
SVG をダウンロードし、テキストエディターか任意のベクターアプリで開きます。少しずれた塗りを、それぞれブランドのコードに置き換えてください。クリーム色の塗りはすべて #F3E9D2 に、二つの緑はどちらも #1F4D3A にします。これでファイルの塗りはちょうど二つ（緑 38 個、クリーム色 14 個）になり、文字も É も崩れずに表示されました。
テキストエディターなら、検索と置換で済みます。この SVG では、色が rgb(244,235,210)、rgb(31,74,55)、rgb(47,82,63) として保存されていました。ベクターアプリなら、同じ塗りの色で選択して新しい値を設定します。
| ファイル | 色数 | ブランドのカラーコードとの完全一致 |
|---|---|---|
| 生成された PNG（4 版） | 14,986–17,288 | ピクセルの 0.00–2.63% |
| ベクター化した SVG | 塗り 3 つ | 3 つ中 0 |
| 置換後の SVG | 塗り 2 つ | 2 つ中 2 |
印刷に出す前の確認
最終的な SVG を開き、塗りを読んでください。ブランドの色ごとに、塗りはちょうど一つずつのはずです。小さな文字は、実際に使うサイズで確認してください。私たちの二行目は原寸で読めました。SVG を原本として保管し、PNG はそこから書き出してください。逆の順番にはしないでください。
ロゴの正確な色
GPT Image 2.5 は指定したカラーコードを正確に使いますか
私たちのテストでは、正確ではありませんでした。四つのロゴには 14,986 から 17,288 色が含まれ、指定したカラーコードに一致したピクセルは 3% 未満でした。
店の名前は正しく綴られていましたか
はい。四つの版すべてで、CAFÉ のアクセント記号も含めて正しく綴られていました。それでも、必ず自分で確認してください。
Ciyo の Vector ツールは色をどう扱いますか
私たちのロゴを、約 10 秒、2 クレジットで、パス 52 個、塗り 3 つの SVG にトレースしました。
ちょうど二色にするにはどうすればよいですか
SVG の塗りを、ブランドの二つのコードに置き換えてください。私たちのファイルは、それで塗りがちょうど二つになりました。
印刷会社に渡せるロゴを作る
Ciyo でいくつかの版を生成し、いちばん良いものを SVG にトレースして、正確な色を設定してください。