ドット絵からピクセル単位で正確な画像まで、ピクセルのQRコード

ピクセルのQRコードとは、1モジュールにつき1つの、輪郭のくっきりした四角で描いたQRコードで、角丸も、ドットも、グラデーションもありません。同じグリッドを、鮮明な画像として書き出すことも、ドット絵エディターで描き直すことも、ブロック、ポッチ、タイル、刺しゅうの目で組み立てることもできます。このページでは、見た目、作り方、そしてそれぞれをスキャンできる状態に保つピクセル数を扱います。

1 内容
https://
登録不要 QRコード無制限 ウォーターマークなし Free high-resolution downloads
2 デザイン
パターン
3 プレビュー
コピーしました

ピクセルのQRコードとは?

ピクセルのQRコードとは、すべてのモジュールが輪郭のくっきりした素の四角で、シンボル全体がピクセルのグリッドとして見えるQRコードです。モジュールとはQRコードのグリッドの1つのセルで、暗いか明るいかのどちらかです。四角いモジュールは、QRコードの規格であるISO/IEC 18004が記述している形そのものなので、ピクセルのスタイルはスキャンの許容度が最も高いスタイルです。柔らかい見た目と引き換えにスキャンの余裕を手放すドットのQRコードとは、範囲の正反対の端にあります。ほかのスタイルや輪郭はQRコードの形にまとめており、既存のコードのバージョン、誤り訂正レベル、モジュール数はQRコードデコーダーで読み取れます。

連絡先とそのとなりのQRコードが入ったネイビーの名刺が、木製のスタンドに立てられている様子

すべてのピクセルのQRコードの背後にあるグリッド

QRコードはもともとピクセルのグリッドであり、モジュール単位での大きさは、格納するデータの量で決まります。グリッドを知っていることが、ドット絵やブロックでQRコードを作ることを可能にします。

  • バージョン1は21 x 21モジュール - バージョンが1つ上がるごとに1辺が4モジュール増えるので、バージョン2は25 x 25、バージョン3は29 x 29、最大のバージョン40は177 x 177です。
  • クワイエットゾーンで1辺の長さが8増える - クワイエットゾーンとは、シンボルがどこで始まりどこで終わるかをスキャナーが検出できるようにする、QRコード周囲の空白の余白です。四辺それぞれに4モジュールなので、バージョン1のコードは合計で29 x 29セルを占めます。
  • データが短いほどグリッドは小さくなる - 誤り訂正レベルLでは、バージョン1は17バイト、バージョン2は32バイト、バージョン3は53バイトを格納できます。リンクが短いかどうかが、21モジュールの工作になるか33モジュールの工作になるかを分けます。
  • 3つの角の四角は決まっている - 各ファインダーパターンは7 x 7モジュールで、暗いリング、明るいリング、3 x 3の暗い中心でできています。ファインダーパターンはどのQRコードでも同じで、正確に写し取らなければなりません。

QRコードを手作業で組み立て直すときは、すべてのモジュールが同じように重要です。生成された画像は、ロゴのために数個のモジュールを失っても問題ありません。誤り訂正がそれを見込んで計画されているからです。ブロックを10個置き間違えた手作りのグリッドは、その蓄えを間違いに使い果たしています。

ピクセルのスタイルは最も安全なスタイル

四角いモジュールはセルを完全に埋めるので、ピクセルのQRコードは、どのモジュールのスタイルよりもインクが多く、輪郭が鮮明で、スキャンの余裕が広くなります。そのため、もともと条件が厳しい場面ではピクセルのQRコードが正しい選択です。2 cm未満のコード、感熱式のレシートプリンター、刺しゅう、彫刻、低解像度のディスプレイ、そして遠くから撮影されるものすべてです。

QRコードを作成
ブランドQRコードが付いた、「Shop Windows & Signage、コレクションと営業時間はこちらをスキャン」と書かれた黒い店頭のガラスのサイン

ピクセルのQRコードが最も活きる場面

ピクセルのスタイルは、まったく異なる2つの状況に向いています。意図的なレトロ調、8ビット風の見た目を求めるデザインと、四角しか作れない製作方法です。

ドット絵とレトロゲームのグラフィック

四角いモジュールのコードは、ドット絵のポスター、インディーゲームのメニュー、配信のオーバーレイの中に自然になじみます。アートワークのほかの部分と同じピクセルのグリッドに、1モジュールにつき絵の1ピクセルで描いてください。

Minecraftなどのブロック建築

1モジュールにつき1ブロックを、コントラストの強い2種類の素材で、平らな地面に置きます。バージョン1のコードは21 x 21ブロック、クワイエットゾーンを含めると29 x 29ブロックで、真上から撮ったスクリーンショットからスキャンします。

LEGO、タイル、モザイク

1モジュールにつき1つのポッチまたはタイルです。バージョン2のコードには、クワイエットゾーンを含めて33 x 33ポッチの面積が必要で、48 x 48の基礎板なら縁取りの余地を残して収まります。

クロスステッチ、編み物、刺しゅう

目のそろった布に、1モジュールにつき1目です。糸はインクよりも広がり方が読みにくいので、デザインはバージョン1から3にとどめ、白かクリーム色の地に黒を使ってください。

LEDマトリクスと低解像度のディスプレイ

32 x 32のLEDパネルなら、1モジュールにつき1つのLEDで、バージョン1のコードをクワイエットゾーンごと、合計29 x 29個のLEDで表示できます。背景を点灯させ、モジュールは消灯したままにして、コードが明るい地に暗いものとして読めるようにしてください。

レーザー彫刻と感熱印刷

焼く、削る、熱を加えるといった加工では、縁が少しぎざぎざになります。セルいっぱいの四角いモジュールは、モジュールあたりに残る素材が最も多く、レシートプリンターやラベルプリンターが四角いモジュールを使うのはそのためです。

QRコードには何ピクセル必要?

QRコードの画像には、1モジュールあたり整数個のピクセルが必要で、カメラが画面から読み取る場面では1モジュールあたり4ピクセル以上が必要です。どちらのルールも、モジュールのグリッドがピクセルのグリッドにどう対応するかから来ています。

「ゲスト用Wi-Fi」のサインに付いた、円形フレームの丸いQRコード

鮮明なQRコード画像のためのピクセル数

QRコードのピクセルサイズは、クワイエットゾーンを含むモジュール数に、各モジュールに割り当てるピクセル数を掛けたものです。一度計算しておけば、リサイズで生じるぼやけた輪郭を避けられます。

  • 1モジュールあたりのピクセル数を整数にする - バージョン3のコードは29モジュールで、クワイエットゾーンの8を足すと合計37です。1モジュールあたり10ピクセルなら画像はちょうど370 x 370ピクセルになり、すべてのモジュールの辺がピクセルの境界に乗ります。
  • 中途半端なサイズを避ける - その370ピクセルの画像を400ピクセルにリサイズすると、各モジュールは10.8ピクセルになるので、幅10で描かれるモジュールと幅11で描かれるモジュールが混ざり、辺に沿ってグレーのピクセルが出ます。そのサイズでもコードはスキャンできますが、ぼやけて見えます。
  • スムージングではなく最近傍法で拡大する - 画像編集ソフトは、拡大するときに初期設定でスムージングをかけます。最近傍法(ニアレストネイバー)を選ぶか、CSSでimage-rendering: pixelatedを設定し、整数倍でだけ拡大してください。
  • 画面では1モジュールあたり4ピクセルを確保する - 私たちのデコーダーのテストでは、四角いモジュールは、キャプチャ時の1モジュールあたり2.5〜10ピクセルで16回中16回の位置でデコードでき、1モジュールあたり2ピクセルでは16回中10回でした。カメラが画面を1対1でキャプチャすることはないので、表示上の1モジュールあたり4ピクセルが妥当な下限です。
  • 印刷にはベクターを使い、ピクセルのことは忘れる - SVG、PDF、EPSは各モジュールを幾何学的な四角として保存するので、ファイルにピクセルサイズはなく、どんな寸法でも鮮明に印刷されます。

4ピクセルのルールのもとになったデコーダーのテストでは、jsQRを使いました。jsQRは、ブラウザで動く多くのスキャナーに入っているオープンソースのデコーダーです。iOSとAndroidのカメラに組み込まれたデコーダーは非公開で、テストの対象ではありません。したがって、この数値は限界ではなく、控えめな実用上の下限として扱ってください。

手作りのピクセルのQRコードのルール

ブロック、ポッチ、刺しゅうの目で作るQRコードは、印刷したQRコードと同じルールに従います。それに加えて、すべてのモジュールを手で置く場合にだけ当てはまるルールがいくつかあります。

  • まずデータを短くする - 1文字削るごとに、コードがより小さなバージョンに下がる可能性があります。短いドメインを使い、トラッキング用のパラメータは付けず、材料を買う前にモジュール数を確認してください。
  • バージョンが分かる作成ツールを選ぶ - 誤り訂正レベルが低いほど、同じリンクでもグリッドは小さくなります。KoloQRはロゴに対応するためにすべてのコードをレベルHで生成するので、できるだけ小さなグリッドにしたい人は、レベルLを設定できる作成ツールを使ってください。
  • グリッド付きの印刷物を見ながら作る - コードを大きく書き出し、グリッドを重ね、行と列に番号を振ります。1行ずつ組み立てて、終わった行に印を付けてください。間違いの原因は、モジュールの読み違いではなく、どこまで進んだかを見失うことです。
  • 平らでつやのない、コントラストの高い素材を選ぶ - Minecraftなら黒と白のコンクリート、LEGOなら黒と白のプレートです。質感のある素材、光沢のある素材、発光する素材は、各モジュールの中にノイズを加えます。
  • クワイエットゾーンも作る - 四辺それぞれに明るいモジュールを4つ分、明るいモジュールと同じ素材で作ります。草、テーブルの端、基礎板の縁取りがコードにじかに接していることが、工作が失敗するよくある原因です。
  • 正面からスキャンする - 均一な光のもとで、真上または真正面から写真かスクリーンショットを撮ります。ファインダーパターンが完成した時点でテストし、半分まで進んだところでもう一度テストして、最後の行より前に間違いを見つけてください。
会議場のロビーに置かれた、「Summit 2025 - Shaping What's Next、スキャンして登録」と書かれた濃紺のイベントバナーとQRコード

ピクセルのQRコードのアイデア

工作とデザインを4つ、それぞれがうまくいくかどうかを決める数字とともに紹介します。

Minecraftサーバーの参加用コード

スポーン地点の床に置いた、地図サイズのQRコードで、サーバーのウェブサイトにリンクします。17文字のURLをレベルLで作ればグリッドは21 x 21ブロックで、より長いアドレスをレベルHで作ると33 x 33以上になることがあります。

ショーウィンドウ用のLEGOのQRコード

白い48 x 48の基礎板に黒い1 x 1のプレートを並べ、バージョン2またはバージョン3のコードをクワイエットゾーンごと収めます。垂直に取り付け、ポッチの影が出ないように正面から照らしてください。

クロスステッチのWi-Fiコード

14カウントの布に刺した、額入りのゲスト用Wi-Fiコードです。Wi-Fiのペイロードは長いので、誤り訂正レベルLでバージョン3か4になると見込んでください。余白を除いて幅29〜33目です。

コードを組み込んだドット絵のポスター

QRコードをイラストと同じグリッドに、ポスターの最も明るい色の上に最も暗い色で描きます。ほかのアートワークは、四辺それぞれでコードから4モジュール離してください。

ピクセルのQRコードの作り方

ピクセルのQRコードの生成は1分ほどで、ドット絵や実物の工作に向けた準備にはもう数分かかります。

QRコードを作成
  1. 1

    機能する最短のリンクを入力する

    リンクを貼り付け、なくてもよい部分はすべて取り除きます。文字が少ないほどモジュールが少なくなり、それだけピクセル、ブロック、刺しゅうの目も少なくなります。

  2. 2

    パターンを「四角」に設定する

    「四角」のパターンと四角い目のスタイルを選び、すべてのモジュールと3つのファインダーパターンが輪郭のくっきりした四角になるようにします。

  3. 3

    グラデーションのない2色を使う

    明るい背景に濃い色を、グラデーションなしで選びます。プレビューの下のコントラストのバッジが、その組み合わせで確実にスキャンできそうかを示します。

  4. 4

    印刷にはSVG、ピクセル作業にはPNGを書き出す

    印刷するものにはSVGをダウンロードします。ドット絵や工作の型紙には、PNGをダウンロードし、最近傍法で整数倍に拡大してください。

さまざまな色とスタイルの正方形QRコードを表示するKoloQRのエディタ

素の四角を、きちんと

円形やカスタム形状のQRコードを作れる無料のQRコード作成ツールであるKoloQRは、最も素朴な種類のコードも作れます。「四角」のパターンを選んで2色を設定すれば、作成ツールが輪郭のくっきりしたモジュールを、塗りつぶしたファインダーパターンと、選んだ色のコントラストの測定値とともに描きます。

KoloQRは、印刷向けにSVG、PDF、EPSを、画面向けにPNGを書き出し、アカウントも透かしもありません。KoloQRはすべてのコードを誤り訂正レベルHで生成し、作るのは静的QRコードだけです。そのため、グリッドは同じリンクのレベルLのコードより大きくなり、コードを作ったあとで遷移先を変えることはできません。

QRコードを作成

ピクセルのQRコードの書き出し形式

ピクセルのQRコードのくっきりした輪郭が、画面、プリンター、エディターに届くまで保たれるかどうかは、ファイル形式で決まります。

PNG

可逆圧縮なので、モジュールの輪郭はくっきりしたままです。ドット絵エディター、ゲームのテクスチャ、工作の型紙に適した形式です。JPGは避けてください。JPGの圧縮は、すべての輪郭に沿ってグレーのリンギングを残します。

SVG

各モジュールがピクセルではなく四角として保存されるので、コードはどんなサイズでも鮮明で、ピクセル数の計算はもう必要ありません。印刷に使うべき形式です。

PDFまたはEPS

印刷所、彫刻業者、看板業者のためのベクター形式です。どちらも、モジュールがそのまま編集できる状態でIllustratorやInDesignで開けます。

Questions? Answered

クワイエットゾーンの8を含むモジュール数に、1モジュールあたりの整数のピクセル数を掛けてください。バージョン3のコードは余白を含めて幅37モジュールなので、1モジュールあたり10ピクセルなら370 x 370ピクセルです。画面用には、1モジュールあたり4ピクセル以上を確保してください。印刷用には、ピクセルサイズをそもそも持たないSVGかPDFを使ってください。

各モジュールの幅がピクセルの端数になるサイズに画像が拡大縮小され、編集ソフトが輪郭をなめらかにしたからです。リサイズは整数倍でだけ行い - 370ピクセルなら600ではなく740へ - 拡大縮小の方式を最近傍法に設定してください。ウェブページでは、CSSのルールimage-rendering: pixelatedが同じ働きをします。

バージョン1のQRコードは21 x 21ブロック、4ブロックのクワイエットゾーンを含めると29 x 29ブロックで、誤り訂正レベルLで最大17文字を格納できます。一般的なウェブサイトのリンクにはバージョン2か3が必要で、幅は25ブロックか29ブロックです。工作を小さく保つには、レベルLを選べる作成ツールを使ってください。

はい、生成したコードをモジュール単位で写し取るのであれば描けます。QRコードを自由に手描きでデザインすることはできません。パターンはデータから計算されるものだからです。コードを生成してPNGを書き出し、最近傍法で1モジュールあたり1ピクセルに縮小してください。その画像はすでにドット絵で、色を変えてエディターに配置できます。

はい、すべての暗いモジュールが、すべての明るいモジュールよりはっきり暗いかぎり使えます。スキャナーはデコードの前に画像を白黒に変換するので、1つの明るい背景の上に複数の濃い色を使っても機能します。暗いモジュールと明るいモジュールの明るさが近い場合は、色相が何であれ失敗します。

誤り訂正レベルから想像するよりも少ない数です。レベルLはシンボルの約7%、レベルHは約30%を復元しますが、誤りは固定サイズのブロックごとに訂正されるので、いくつかの間違いが近くに固まると1つのブロックが訂正しきれなくなります。ファインダーパターン、タイミングパターンの線、ファインダーパターンの脇にある形式情報の帯には、手を付けてはいけないものとして扱ってください。

はい。四角いモジュールはセルを埋めるので、セルの幅の80%で描いたドットの約2倍のインクを持ち、デコーダーが読み違えるすき間も残しません。小さな印刷サイズ、低解像度のディスプレイ、粗い製作方法には、四角いモジュールのほうが安全な選択です。

カメラアプリを開いてQRコードに向けると、タップできるリンクが表示されます。Google Pixelには、クイック設定の「Scan QR code」タイルと、ホーム画面の検索バーのGoogle Lensもあります。Androidでの読み取りガイドが、すべての方法を扱っています:AndroidスマートフォンでQRコードを読み取る方法

はい。KoloQRなら、SVG、PDF、EPS、PNGのダウンロードも含めて、四角いモジュールのQRコードを無料で作れ、アカウントも透かしもありません。コードは静的なので、スキャン回数の上限も有効期限もありません。

KoloQRを選ぶ理由

  • ウェブサイト、メニュー、Wi-Fi、PDF、名刺用のQRコードを作成
  • 色・ロゴ・オリジナルの形をカスタマイズ
  • 高品質なPNG・SVGファイルをダウンロード
  • 印刷にもデジタルにも対応
QRコードを作成
シンプルな黒いQRコードと、同じコードをブランドカラーの円形にデザインし直したもの