色とコントラストの選び方

見た目が良く、確実にスキャンできるQRコードの色の選び方。

色を使うとQRコードが目立ちますが、選び方を間違えるとスキャンできなくなります。QRスキャナーは暗い部分と明るい部分のコントラストを検出して動作します。コントラストが大きいほど、確実に読み取れます。

重要なルール

コントラスト不足は、カスタムデザインのQRコードでスキャンが失敗する最大の原因です。これが最もよくある失敗の原因です。

基本

前景(暗いモジュール):従来は黒。どんな暗い色でも可。光を吸収する必要があります。

背景(空白部分):従来は白。どんな明るい色でも可。光を反射する必要があります。

プリセットカラーとQRコード色・背景色入力が表示されたカラーピッカー
プリセットとカスタムHex入力が可能なカラーカスタマイザー

コントラストのルール

前景と背景の間に少なくとも40%のコントラストを目指してください。各組み合わせの効果は以下の通りです:

組み合わせ動作
白地に黒✅ 完璧
白地に濃い青✅ とても良い
クリーム地に濃い緑✅ 良い
薄いグレー地に紺✅ OK
薄いグレー地にグレー❌ コントラスト不足
ピンク地に赤❌ スキャン不可

安全な組み合わせ

クラシック(常に機能):白地に黒。白地にとても暗い色。とても明るい色地に黒。

ブランドセーフ:白地に暗いブランドカラー。明るいブランドカラー地に黒。コントラストを高く保ちます。

クリエイティブ(慎重にテスト):中間色、補色、グラデーション—すべてテストが必要です。

避けるべきこと

低コントラストの組み合わせ:暗い色同士、明るい色同士、似た色相。これらはスキャンできません。

問題のある前景色:黄色(明るすぎる)、ネオン/鮮やかな色(コントラスト不良)、パステルカラー。

色覚異常への配慮:赤/緑のみの組み合わせは問題になる可能性があります。男性の約8%に何らかの色覚異常があります。

透明な背景

PNGとSVGは透過をサポートしており、すっきりした見た目でどんな素材にも馴染みます。ただし注意点があります:最終的にどんな背景に配置されるかコントロールできません。誰かがあなたの透過QRコードを暗い背景に配置すると、スキャンできなくなります。

透過を使用する場合は、配置ガイドラインを提供してください:「白または明るい背景のみに使用してください。」

グラデーション

グラデーションは美しく見えますが、グラデーションの両端が背景とのコントラストを維持する必要があります。前景のグラデーションが明るい色にフェードしないようにしてください—スキャンできなくなります。グラデーション全体を暗い範囲に保ちましょう。

色のテスト

当社のカスタマイザーはコントラストが低すぎる場合に警告を表示します。警告を無視しないでください。

しかし、実際の環境でのテストが不可欠です:

  1. QRコードをダウンロード
  2. 印刷物用なら印刷する
  3. iPhoneとAndroidでスキャン
  4. 異なる距離でテスト(近くから、数フィート離れた場所から)
  5. 異なる照明条件でテスト

印刷とスクリーン

印刷:印刷された色は画面上とは異なって見えます。必ずテスト印刷を行ってください。紙の色が背景に影響します。CMYKカラースペース。

スクリーン:印刷よりも許容度が高い。複数の画面でテスト(明るさは異なります)。

製品/パッケージ:素材の色を考慮してください。反射面は難しいです。可能であれば実際の素材でテストしてください。

よくある問題

「ブランドの青がスキャンできない」:おそらく明るすぎます。QRコード用にはより暗い色合いを使用してください。

「画面では良く見えるが、印刷するとダメ」:画面と印刷の色は異なります。テスト印刷して調整してください。

「グラデーションでスキャンできなくなる」:おそらくグラデーションが明るくなりすぎています。前景のグラデーション全体を暗いトーンに保ってください。

よくある質問

色を反転(暗い背景に明るい色)できますか? 一部のスキャナーは対応していますが、信頼性が低くなります。お勧めしません。

ブランドカラーに正確に合わせるべきですか? コントラストが高ければ、はい。そうでなければ、QRコード専用により暗い/明るいバリエーションを使用してください。

印刷したときに同じ見た目になりますか? いいえ。必ずテスト印刷を行ってください。

色を調整してもまだスキャンの問題がある場合は、トラブルシューティングガイドをご覧ください。