無料スタイル付き QR コードジェネレーター

色、サイズ、コーナースタイルでカスタムQRコードを作成します。PNGまたはSVGでダウンロードします。

ブラウザ内で完全に生成
300 px
プレビューがここに表示されます

QRコードについて

QRコード(クイックレスポンス)は、スマートフォンや専用リーダーでスキャンできる2Dバーコードです。テキスト、URL、連絡先情報、WiFi認証情報などをエンコードします。このジェネレーターは、マーケティング、パッケージング、デジタル使用に適したカスタムカラーとサイズでスタイル付きQRコードを作成します。

誤り訂正レベル

よくある質問

QRコードでカスタムカラーを使用できますか?

はい!ほとんどの最新のQRスキャナーは色をうまく扱います。信頼性の高い読み取りのために、前景と背景の間に高いコントラストを確保してください。ターゲットスキャナーでテストしてください。

どのサイズを使用すべきですか?

より大きなQRコードは、より高速かつ信頼性高く読み取られます。少なくとも100×100 pxを使用します。印刷の場合は、小さな印刷アプリケーション用に300 px以上を使用します。

PNGまたはSVG · どの形式が最良ですか?

スケーラブルなベクター(ウェブ、印刷用のスケーリング)にはSVGを使用します。ラスター画像(ウェブ表示、迅速な共有)にはPNGを使用します。両方とも読み取りに同等に機能します。

このスタイラーが実際に何をするか、そしてより広い分野はどこに向かうか

このページは意図的に小さなスタイリングコントロールのセットを公開します:前景(暗い)色、背景(明るい)色、100から1000ピクセルの間の出力サイズ、およびエラー訂正レベル(L / M / Q / H)を選択します。それからそれらの設定で標準のQRコードを完全にブラウザでレンダリングし、PNGとSVGのダウンロードを提供します。ロゴ埋め込みも、丸めモジュール形状も、装飾的なファインダーパターンのバリエーションもありません。これらの機能はより広いスタイル化QRエコシステムに存在し、以下に記述されています、それらは「スタイル化QRコード」について学んでいるほとんどの人が理解したいことですが、注意深いツールはそれが配信するものについて正直です。

スタイリングがなぜ機能するのか、エラー訂正のヘッドルーム

QRコードはReed-Solomonエラー訂正を使用します(Irving S. ReedとGustave Solomonによって1960年に導入された、指紋の汚れを通してCDを再生し、Voyagerプローブが恒星間空間から自宅に電話することを可能にする同じ符号化方式)。コードはモジュールの一定割合が欠けているか誤って読まれても、元のデータが回復できるように冗長にエンコードされています。Denso Wave自身の言葉での4つの標準化されたレベル:

Denso Waveの公式ガイダンス:「QR Codeが汚れる工場環境ではレベルQまたはHを選択できます」そして「大量のデータがあるクリーンな環境ではレベルLを選択できます。」実際のスキャン条件で生き残る最低レベルを選択してください、LからHへのすべてのステップが同じペイロードに対してコードを密にする(辺ごとのモジュールが増える)ためです。

スタイリングでは、関係は直接的です:エラー訂正のヘッドルームが多いほど、スキャンを破壊することなく視覚的自由が大きい。ロゴ、再着色されたモジュール、丸められたモジュール形状、さらには明るいと思われる背景の柔らかい色のチントでさえ、それぞれが予算の一部を消費します。あまりにも多くを追加するとスキャナーのReed-Solomonデコーダーが訂正を使い果たします。ほとんどのスタイリングジェネレータが従う実用的なレシピ:ロゴまたは任意の「デザイナー」スタイリングを追加する場合は、レベルHにバンプし、それでもスケールで印刷する前に複数のデバイスでテストしてください。

モジュール/ドット形状のバリエーション

仕様の標準QRコードは、丸めなしの正方形モジュールを使用します。現代のスタイリングライブラリ、およびより広いスタイル化QRエコシステムは、通常、固定された名前付きモジュール形状オプションのセットを公開します。Denys Kozakのqr-code-stylingライブラリによって確立され、現在は多くのジェネレータによってコピーされているデファクトの語彙:

ライブラリは、形状を適用する前に、隣接する同じ色のモジュールを接続されたブロブとして扱います、これがrounded and classyが各モジュールを孤立して見せるのではなく、連続的な流れるストロークを与える理由です。スキャナーはモジュールの中心を読み取るので、重心-から-重心のコントラストが生き残る限り、カメラは満足です。このツールは現在、標準の正方形モジュールのみを公開しています、これらの他の形状はサポートするために異なるレンダリングライブラリが必要です。

アイ/ファインダーパターンのバリエーション

すべてのQRコードには3つの「目」があります、左上、右上、左下のコーナーにある大きなブルズアイ型のパターンです。これらのファインダーパターンには1:1:3:1:1の固定モジュール比があり、Masahiro Haraのチームが当時の印刷物に対して分析した内部比率で、偶然にはほぼ発生しないシーケンスを見つけ、スキャナーはそれらを素早く見つけることができます。

各ファインダーパターンは実際に2つの部分で構成されています:外側のコーナースクエア(逆色の5×5内側リングを持つ7×7モジュールリング)とコーナードット(3×3のソリッドセンター)。スタイリングライブラリはこれら2つの部分を独立してカスタマイズ可能として扱うため、QRCode MonkeyやQR TIGERのようなツールで別々の「フレーム」と「ボール」コントロールが表示される理由です。両方とも、データモジュールと同じ形状オプションのいずれかを取ることができます:squaredotroundedextra-roundedclassyclassy-rounded

目のスタイリングのスキャナビリティに関する警告:ファインダーパターンは、スキャナーが最初にコードを見つける方法です。それらをあまりにも積極的に歪める(例えば、ソリッドスクエアがあるべき場所にちっぽけなドット)と、カメラがロックオンに失敗する可能性があります、特に距離や角度で。安全なルール:少なくとも外側のコーナースクエアリングを連続した閉じた形状(square、rounded、extra-rounded、「dots」ではない)として保ち、内側のドットでより冒険的になれます。

埋め込みロゴ

これは2026年に最も要求されたQRスタイリング機能です。メカニズムは残酷に単純です:QRコードは通常通り生成され、その後ロゴ画像(PNG、JPEG、SVG)が中央の上に描画され、データモジュールのいくつかを置き換えます。Reed-Solomonエラー訂正はその後、スキャン時に隠されたモジュールを「埋めます」。実用的な制限:

このツールはロゴを埋め込みません。これは意図的なスコープの選択です、ロゴオーバーレイは「色 + サイズ」ツールに適合しない注意深いインタラクションモデル(アップロード、位置決め、透明度、ECレベルロック)を必要とします。QR-with-logoワークフローについては、関連するQR Code Generatorを見てください。

カラーカスタマイゼーション、安全なものと安全でないもの

色はこのツールが実際に公開する唯一のスタイリングレバーなので、このセクションは最も直接的に関連しています。最初のルール:コントラスト。QRスキャナーはすべてのモジュールを見て「暗いか明るいか?」を決定し、2つの間のギャップが大きいほど、より速くより信頼性高く決定します。QRコード特有の広く引用される作業数は、前景と背景の間の少なくとも4:1のコントラスト比で、実世界の信頼性のために4.5:1以上が好まれます。非テキストグラフィックに関するWCAG 2.xの一般的なガイダンス(基準1.4.11)は3:1の最小値を設定します;QRコードはカメラに頼る人間の文脈的推論がないため、そのバーを快適なマージンでクリアする必要があります。

第二のルール:反転しない。QRコードは仕様により、明るい背景上の暗いモジュールです。明るい-上-暗い(「反転」)QRコードは技術的に有効で、最もスマートなスキャナー(モダンなiOSカメラ、最新のGoogle Lens)はそれらを反転して読むことができますが、現場の電話の意味のある部分はできません。古いAndroidカメラアプリ、サードパーティスキャナーアプリ、およびほぼすべての専用バーコードスキャナーは暗い-上-明るいを想定し、逆では失敗します。暗いブランド背景があり、QRをその上に置きたい場合の推奨パターン:反転しない、代わりに、暗い表面上のコントラストのある明るい「プレート」または額装されたボックスの中に標準の暗い-上-明るいQRを配置してください。

第三のルール:グラデーションとマルチカラーモジュールはデコーディングマージンを消費します。スタイリングライブラリは暗いモジュール、背景、そして目さえも独立して線形および放射状グラデーションをサポートし、画面上で見事に見えます。しかし、すべてのスムーズな色の遷移により、モジュールごとの暗い/明るい決定がスキャナーにとって難しくなります、特に乏しい光で。グラデーションは、グラデーションが単一の暗いファミリー内にとどまっている場合に最も安全です(例:濃紺から深紫へフェード、両方とも明らかに「暗い」)、中間トーンを通過するのではなく。このツールは現在、ソリッドカラーのみを公開しており、これが最も安全な出発点です。

PNG vs SVG、出力形式の選択

PNGはラスター形式です。QRコードは固定ピクセルグリッドにレンダリングされます。長所:古いメールクライアントと任意の画像表示サーフェスを含むどこでも動作します。短所:レンダリングされた解像度を超えてスケールアップすると、モジュールのエッジに沿ってぼかしとエイリアシングが発生し、大きなプリントでのスキャナビリティを損なう可能性があります。600×600 mmのポスターで使用される300pxのPNGの場合、モジュールは目に見えてソフトに見えます。

SVG(Scalable Vector Graphics)はベクター形式です。QRコードは多角形のセットとして記述され、レンダラーはディスプレイまたは印刷デバイスが要求する解像度でそれらをラスタライズします。長所:品質の損失なしに無限にスケーラブル;非常に小さなファイルサイズ(多くの場合数kB);Illustrator、Affinity Designer、Inkscapeで編集可能;モダンなWebブラウザでネイティブに動作します。実用的なルール:画面上に行く場合、どちらの形式でも問題ありません;印刷に行く場合、特にポストカードサイズを超える任意のスケールで、SVGを選択してください。

QRコードにはJPEGを避けてください。JPEGの不可逆圧縮アーティファクトは高コントラストエッジの周りに集中し、まさにすべてのQRモジュール境界がある場所で、高品質設定でもJPEGは安価なスキャナーでデコードを破壊するのに十分なエッジファズを導入する可能性があります。PNGが正しいラスターの選択です。

クワイエットゾーンの要件(しばしば忘れられる)

ISO/IEC 18004はクワイエットゾーン、明るい色の背景のマージン、コードの四辺すべてに少なくとも4モジュール幅を要求します。それなしでは、スキャナーは近くのタイプ、ボーダー、または背景画像をコードの一部と間違える可能性があり、デコードに失敗するか誤ってデコードします。実用的な意味で:印刷されたコードで単一モジュールが2 mm幅の場合、クワイエットゾーンは各辺で少なくとも8 mmである必要があります。このツールのPNGおよびSVGダウンロードには、標準のクワイエットゾーンマージンが含まれています。多くの「クロップされた」Instagramフレンドリーなクエスポートはルールを破り、それは「なぜ私のコードはスキャンされないのか?」のフラストレーションの主要な原因です。

支払いQRコードに関する注意

世界のQRコードトラフィックの些細でないスライスは支払い用で、これらの支払いQRコードは汎用ではありませんEMV QRコード(EMVCo仕様、現バージョン1.1、最終更新2020年11月27日)は、加盟店ID、取引金額、通貨、MCC、国コード、CRCチェックサムの構造化ペイロードをエンコードします。Alipay and WeChat Pay(中国)、UPI(インド)、PromptPay(タイ)、PayNow(シンガポール)、PIX(ブラジル)は、規制当局定義のペイロードに従います。それらは視覚的に通常のQRコードのように見えますが、汎用カメラアプリは実際にはそれらで支払うことができません、ペイロードは支払いプラットフォーム自身によって発行される必要があります。このツールで機能する支払いQRコードを生成することはできません、視覚的なスタイリングがどれほど本物であっても。支払いプロセッサのマーチャントダッシュボードを使用してください。

2020年後のブランドスタイル化QRブーム、なぜ重要か

QRコードは2010年頃から技術的にどこでも利用可能でしたが、西側での採用はCOVID-19が非接触ピボットを強制するまで浅いままでした。QRコードインタラクションは2018年から2020年にかけて94%成長;QRコードスキャンに起因するダウンロードは2020年Q1から2021年Q4の間に750%成長しました。2022年に約8900万人の米国スマートフォンユーザーがQRコードをスキャンしました。Juniper Researchは、QRコード決済が2025年の$5.4兆から、2029年までにグローバルで年間支出が$8兆を超えると予測しています。ブランド化QRベンダーQR TIGERは、スタイル化/ブランド化QRコードがプレーンな白黒コードよりも最大70%多くのスキャンを得ると主張しています(正確な数字はベンダーの主張として扱いますが、ブランドスタイリングがスキャンを駆動するという方向性のポイントは広く支持されています)。

2026年までに、QRコードはもはや奇妙なユーティリティインフラストラクチャの一部ではなく、ブランドサーフェスです。企業は、タイポグラフィやパッケージングをオンブランドにしたいのと同じように、QRコードをオンブランドに感じてほしいと考えています。「スタイラー」検索意図が存在する理由であり、競合するツールがすべて同じドット/アイ/カラー/ロゴコントロールセットに収束する理由です。

その他の質問

このツールで支払いQRコード(Alipay、WeChat Pay、UPI)を作成できますか?

いいえ。支払いQRコードは支払いプラットフォーム自身によって発行され、汎用ジェネレータが生成できない暗号的に署名されたまたはプラットフォーム固有のペイロードを埋め込みます。あなたの国の支払いプロセッサーのマーチャントダッシュボードまたは公式Alipay/WeChat/UPI統合を使用してください。

なぜ私の色付きQRコードはいくつかの電話でスキャンされないのですか?

ほとんど常にコントラストの問題です。前景と背景の間で少なくとも4.5:1のコントラストを目指します;暗い-上-明るいを使用します(反転ではありません);工業用リーダーによってスキャンされる可能性がある場合は前景として純粋な赤を避けてください。他の場所にロゴを埋め込む場合は、エラー訂正をレベルHにバンプします。スタイル化QRスキャン失敗の単一最大の原因は、Pantoneスウォッチで素晴らしく見えるが、電話カメラに作業するためのものをほとんど与えない善意のあるブランドカラーです。

ここで私のQRコードの中央にロゴを追加できますか?

このツールではいいえ、色とサイジングに焦点を当てています。ロゴオーバーレイは、この「クイックスタイリング」ワークフローに合わない注意深いインタラクションモデル(アップロード処理、位置決め、透明度、ECレベルロック)が必要です。標準的なパターンは、レベルHでQRをレンダリングし、その後画像エディタを使用して中央にロゴをコンポジットし、カバレッジをモジュールエリアの20-25%に保つことです。

QRコードを印刷する適切なサイズは何ですか?

実用的なルール:QRのエッジ長は、予想されるスキャン距離の少なくとも10分の1である必要があります。1 m離れたところからスキャンされる予定のQRは少なくとも10 cm × 10 cmである必要があります。リビングルームを横切ってスキャンされるTV画面のQRには、大きくしたい;腕の長さでスキャンされる名刺のQRには、1.5-2 cmが機能します。印刷には常にSVG、決してJPEGではなく、4モジュールのクワイエットゾーンを無傷に保ちます。

関連ツール