Tool / 画像

QRコードの作成(URL・Wi-Fi・連絡先・メール・電話)

文字を入れた瞬間にQRコードができる。PNGかSVGで保存して、チラシや掲示物、名刺に貼る。入れた内容はブラウザの外に送らない。

中身の種類

「https://」を省くと先頭に足す。フォームや予約ページのURLをそのまま貼る。


大きさ(保存するPNGの一辺)

誤り訂正レベル

色

角の形
中央のロゴ(任意)

ロゴの画像は保存しない。ページを開き直したら選び直す。

できあがり

QRコードに入る文字列を見る

保存する前に、手元のスマホのカメラで1回読み取って、開く先や中身が合っているか確かめる。「QRコード」は株式会社デンソーウェーブの登録商標。

種類を選んで中身を入れ、スマホで1回読んでから保存する

  1. 上の「中身の種類」から、URL、テキスト、Wi-Fi、連絡先、メール、電話のどれかを選ぶ。
  2. 中身を入れる。入れた瞬間に右(スマホでは上)のQRコードが変わる。Wi-Fiはネットワーク名と暗号化とパスワード、連絡先は名前とふりがなと会社と電話などを入れる。
  3. 大きさをピクセルで決める。下に、選んだdpiで印刷したときの一辺のmmと、1モジュールのmmが出る。
  4. ロゴを置くなら画像を選ぶ。誤り訂正は自動でHに変わる。
  5. 手元のスマホのカメラで画面のQRコードを1回読み取り、開く先が合っていたら「PNGで保存」か「SVGで保存」を押す。

文字はUTF-8でそのまま入れ、模様の細かさは入る量で決まる

模様を作る部分は、npmで公開されているqrcode-generator(Kazuhiko Arase氏、MIT License)から、行列を作る関数とUTF-8に直す関数だけを取り出してページに埋め込んだ。自分で書き直す案も考えたが、誤り訂正の計算とマスクの選び方は細かく、一から書いたものを確かめるより、長く使われてきた実装を読み戻しで確かめるほうが確実だった。文字はUTF-8のバイト列にして、8ビットバイトのモードで入れる。日本語は1文字が3バイトになる。入る量が増えるとバージョン(模様の細かさ)が1から40まで上がり、40でも入らない量は「入りきらない」と出して作らない。上限はLで2,953バイト、Hで1,273バイト。上限ちょうどは作れて、1バイト増やすと止まることを確かめた。

誤り訂正は、模様が汚れたり欠けたりしても読めるようにする仕組みで、デンソーウェーブの説明ではLが約7%、Mが約15%、Qが約25%、Hが約30%まで復元できる。同じ説明で、ふつうはMが多く使われ、工場のように汚れやすい場所ではQかHを選ぶとしている。私は掲示物はMにして、ロゴを置くときだけHにしている。余白は既定で4モジュール。デンソーウェーブは上下左右に4セル以上の余白が要ると書いている。

Wi-Fiは「WIFI:T:WPA;S:ネットワーク名;P:パスワード;;」の形にして、ステルスのネットワークには「H:true;」を足す。ネットワーク名とパスワードに「;」「,」「:」「\」「"」が入っていたら、前に「\」を付けて区切りと見分けられるようにする。WPA2とWPA3も「WPA」と書く。連絡先はvCard 3.0(RFC 2426)で、「;」「,」「\」と改行はRFCの決まりどおり「\」を付けて書く。ふりがなはSOUND;X-IRMC-Nと、X-PHONETIC-LAST-NAME・X-PHONETIC-FIRST-NAMEの両方に入れた。ふりがなの書き方が2通り出回っていて、どちらを読むかは連絡先のアプリで違うからだ。メールはmailto:の形で、件名と本文をUTF-8にしてから%で表し、改行はRFC 6068の決まりどおり%0D%0Aにした。電話はtel:のあとに数字だけを並べる。

ロゴは、真ん中のモジュールを四角く空けて、その上に描く。空ける幅は中心がずれないよう奇数のモジュール数にそろえる。空けた分は誤り訂正で補う前提なので、空けた部分の模様を全部反転させた、いちばん悪い状態で読めるかを試した。Hなら幅の30%まで全部読めて、35%では読めないものが出た。Qも30%まで、Mは20%まで、Lは10%までだった。

色はWCAG 2.2のコントラスト比で測り、4.5を下回ると注意を出す。4.5はウェブの文字の読みやすさの基準を借りたこのページの目安で、QRコードの規格の数字ではない。

入れた中身はURLのクエリに載せない。Wi-Fiのパスワードが入るので、アドレス欄や閲覧履歴に残したくなかった。前回の入力はこの端末のブラウザ(localStorage)に残して次に開いたときに戻すが、Wi-Fiのパスワードとロゴの画像は残さない。

確かめは、ページに埋め込んだのと同じ関数をNodeで動かして行った。模様を画素に塗ってjsQRという読み取りのライブラリに渡し、URL、日本語のテキスト、Wi-Fi、連絡先、メール、電話を4つのレベルで各16通り、384件を読み戻して、入れた文字列と全部一致した。Wi-Fiと連絡先は、読み戻した文字列をもう一度項目に分けて、ネットワーク名や記号入りのパスワード、ふりがなまで入力と同じかを見た。一方、スマホのカメラで読み取ってWi-Fiにつながるか、連絡先に登録されるかは機種とOSの版で違い、このページでは確かめていない。

確かめた資料は次のとおり。どれも2026年10月19日に確認した。

QRコードを作る前によく迷うところ

作ったQRコードに有効期限はあるか

ない。このページのQRコードは、入れた文字列をそのまま模様にしただけで、どこのサーバーも経由しない。読み取った先のページが消えれば開けなくなるが、模様自体は何年たっても同じ中身を返す。そのかわり、読み取られた回数を数えることもできない。

Wi-Fiのパスワードはどこかに残るか

このページからは送らず、URLにも載せず、ブラウザの保存領域にも残さない。開き直すとパスワードの欄は空になる。ただ、作ったQRコードの画像にはパスワードがそのまま入っていて、誰でも読み取れる。壁に貼るなら来客用のネットワークに限る。

スマホで読み取れない

多いのは、余白が足りない、模様と背景の色が近い、印刷が小さすぎる、ロゴが大きすぎるの4つで、どれも画面に注意が出る。印刷したときの1モジュールの大きさは、大きさの欄の下にmmで出している。読み取る距離が遠い掲示物ほど大きくする。

チラシや名刺などの商用の印刷物に使ってよいか

作った画像の使い道に、このページから条件は付けない。模様を作る部分に使ったqrcode-generatorはMIT Licenseのプログラムで、その表記はページのソースに残してある。なお「QRコード」は株式会社デンソーウェーブの登録商標。

QRコードを貼る掲示物と記録の記事

健診機関の予約ページをQRコードにして休憩室に貼っておくと、期限が近い人がその場で予約まで進める。誰がいつまでに受けるかを一覧で見張る表は健康診断の実施義務と記録の記事に置いた。窓口の電話番号や問い合わせ先のメールを紙で渡す場面なら、電話かメールの種類で作れば、読み取った人はそのまま発信や作成の画面に進める。受けた電話とメールを残す表は電話とメールの記録の記事にある。

引き継ぎで共有フォルダや手順書の置き場所を渡すなら、場所の書き方は引き継ぎ書の型の記事を使う。

QRコード