nokoto / QRコードのことなら

読める色で作るQRコード

文字やURLを入れると、その場でQRコードを作れます。色や余白を変えても、選んだ組み合わせが読み取りにくくなっていないかをコントラスト比で確かめながら調整できます。入力した内容はお使いのブラウザの中だけで処理し、サーバーには送信しません。

内容を入力すると、ここにQRコードが表示されます。

保存

SVGは拡大しても粗くならないベクター形式です。PNGはそのまま画像として貼り付けたいときに使ってください。

内容

URLでも、ふつうの文章でもかまいません。複数行のまま読み取れます。文字数が多いほどマス目が細かくなります。

誤り訂正レベル

コードの一部が汚れたり欠けたりしても読み取れるようにする仕組みです。高いほど頑丈になりますが、入れられる文字数は減ります。
誤り訂正レベル

選んだ色の組み合わせが読み取りやすいかどうかは、プレビューの横に出るコントラスト比で確認できます。

余白・書き出しサイズ

マス
目安は4マスです。0にもできますが、周囲に他の絵柄や文字があると読み取りにくくなることがあります。
px
保存する画像の一辺のピクセル数です。印刷用途は大きめ、画面表示だけなら小さめで十分です。

QRコードは「情報を四角いマス目に変換したもの」

QRコードは、文字や数字を一定のルールに沿って2色のマス目の並びに変換したものです。マス目の並び方そのものに情報が入っているため、印刷しても画面に表示しても、カメラで読み取れば元の文字列やURLに戻ります。なお「QRコード」という名称は株式会社デンソーウェーブの登録商標です。このページは、その技術規格(JIS X 0510 / ISO・IEC 18004)をもとに、ブラウザの中だけでマス目の組み立てから画像への書き出しまでを行っており、入力した内容がどこかのサーバーに送信されることはありません。

誤り訂正レベルは「汚れにどこまで耐えるか」の設定

QRコードには、コードの一部が汚れたり破れたりしても読み取れるようにする「誤り訂正」という仕組みが組み込まれています。このページで選べるL・M・Q・Hの4段階は、その耐性の強さの違いです。段ボールに貼って屋外に置いたり、名刺やチラシのように繰り返し手に取られたりする用途では、汚れや折れ目に強いQ・Hを選んでおくと安心です。反対に、スマートフォンの画面にそのまま表示するだけで汚れの心配がない用途であれば、既定のM、あるいはLでも十分なことが多く、同じ内容でもマス目を粗く(コード全体を単純に)できるという利点があります。誤り訂正レベルを上げるほど、入れられる文字数は少なくなる点もあわせて覚えておいてください。

色を変えるときに気をつけたい、2つのこと

QRコードは、黒地に白・白地に黒でなくても読み取れます。ただし色を変えるときは、2つの点に注意が必要です。ひとつは「コントラスト比」、つまり前景色と背景色の明るさの差です。差が小さいほど、カメラや読み取りアプリがマス目の境目を判別しにくくなります。このページでは選んだ2色のコントラスト比をその場で計算して表示しているので、数値を見ながら調整してみてください。もうひとつは「明暗の向き」です。多くの読み取り機は、暗い色のマスが明るい地の上にあることを前提にしています。逆に明るい色のマスを暗い地の上に置いて明暗を反転させると、コントラスト比の数値自体は悪くなくても、読み取れないことがあります。このページでは、この反転も検出して注意を表示するようにしています。

余白(クワイエットゾーン)が必要な理由

QRコードの周囲には、何も描かれていない余白を一定の幅で残す決まりになっています。この余白は「クワイエットゾーン」と呼ばれ、読み取り機がコードの外枠を見つけるための目印の役割を果たしています。この余白の中に文字や罫線、別の絵柄などが入り込むと、読み取り機がコードの範囲を誤って認識し、うまく読み取れなくなることがあります。目安として4マス分の余白を確保しておくと安心です。このページでは余白を0マスまで詰めることもできますが、印刷物やチラシの隅に小さく配置するなど、周囲に他の要素が近づく場面では、余白を削らないほうが無難です。

文字数とマスの細かさ、印刷サイズの関係

QRコードに入れる文字数が増えるほど、同じ情報量をより多くのマス目で表現する必要があるため、コード全体が細かい格子状になっていきます。マス目が細かいコードを名刺やシールのように小さく印刷すると、1つ1つのマスが小さくなりすぎて、カメラのピント合わせやプリンターの解像度によっては正しく読み取れないことがあります。長いURLをそのまま入れるよりも、短縮したURLや必要最低限の文字列にしておくと、同じ印刷サイズでも読み取りやすいコードになりやすいという傾向があります。

このページの限界

このページで表示しているコントラスト比や明暗の判定は、あくまで色の数値上の目安です。実際に読み取れるかどうかは、印刷やディスプレイの発色・光の当たり方・読み取りに使う機器やアプリ・カメラとコードの距離など、数値だけでは分からない条件に左右されます。「このコントラスト比なら必ず読み取れる」ということを保証するものではありません。名刺やチラシ、看板など、実際に人に使ってもらうものを作るときは、印刷したもの・実際に表示する画面を、お手元のスマートフォンなど複数の端末で読み取れることを必ず確認してから配布・掲載してください。