encode / generate

QRコード生成

テキスト・URLからQRコードを生成します。SVG・PNG形式でダウンロード可能。入力データはサーバーに送信されません。

使い方

01
  1. テキストエリアにQRコード化したいテキストまたはURLを入力してください
  2. 出力サイズ（200px・300px・400px）を選択します
  3. 「生成」ボタン（またはCtrl+Enter）でQRコードを生成します
  4. 表示されたQRコードをSVGまたはPNG形式でダウンロードできます
  5. スマートフォンのカメラでそのままスキャンして動作確認できます

実装コード

02

QRコード生成には qrcode パッケージを使用しています。このツールは「外部ライブラリ禁止」ルールの例外で、QRコードのアルゴリズム（リード・ソロモン符号等）は自前実装が非現実的なため許容しています。

import QRCode from 'qrcode'
// ※ qrcode パッケージは外部ライブラリ禁止ルールの例外
//   自前実装が非現実的なQRコード生成に限り許容

export type QrResult = { ok: true; svg: string } | { ok: false; error: string }

export async function generateQrSvg(
  text: string,
  size: number = 300
): Promise<QrResult> {
  if (!text.trim()) return { ok: false, error: '入力が空です' }
  try {
    const svg = await QRCode.toString(text, {
      type: 'svg',
      width: size,
      margin: 2,
      color: { dark: '#19161a', light: '#faf8f4' },
    })
    return { ok: true, svg }
  } catch (e) {
    return { ok: false, error: `QRコードの生成に失敗しました: ${String(e)}` }
  }
}

export function validateQrInput(text: string): string | null {
  if (!text.trim()) return '入力が空です'
  if (text.length > 2953)
    return `入力が長すぎます（最大2953バイト、現在: ${new TextEncoder().encode(text).length}バイト）`
  return null
}

よくある使用例・注意点

03
QRコードの容量制限
QRコードに格納できるデータ量には上限があります。英数字のみの場合は最大4296文字、バイナリ（UTF-8等）では最大2953バイトです。日本語1文字は3バイトなので、約984文字が上限の目安になります。
URLはなるべく短くする
長いURLをQRコードにすると、コードが複雑になりスキャン精度が下がります。URLが長い場合は bit.ly や t.co などのURL短縮サービスを使うか、リダイレクト用の短いURLを用意することを推奨します。
誤り訂正レベルについて
QRコードには誤り訂正機能があり、コードの一部が汚れたり欠けても読み取れます。このツールはデフォルト（レベルM：15%まで復元可能）を使用します。ロゴを重ねたい場合はレベルH（30%）の使用を検討してください。
SVG vs PNG の使い分け
SVGは拡大しても劣化しないベクター形式で、印刷物やWebでの表示に最適です。PNGはラスター形式で、メッセージアプリへの貼り付けや画像として保存したい場合に向いています。ダウンロード時は用途に合わせて選択してください。

関連ツール

04
URLエンコードBase64変換ハッシュ生成

ソースコード

05

このツールのソースコード（テストコードを含む）はGitHubで公開しています。 MITライセンスで自由に利用・改変できます。

GitHub でコードを見る →