本文へスキップ

手動モード

手動モードでは、エンジンが受け付けるすべての設定項目を操作できます。同じコントロールはエディタのUIとAPIの両方にあります。

7つの基本項目

ほかに何も変えないとしても、特に重要なのは次の項目です。

  1. content — エンコードするURLまたはテキスト。
  2. primaryColor + backgroundColor — 4:1以上のコントラストを保つ必要があります。
  3. eccLevel — L / M / Q / H。デフォルトは H。ロゴがある場合は H が必須です。
  4. moduleShape — square / circle / roundedsquare / diamond / hexagon / dot / cross / star / leaf / pointed / drop。
  5. finderOuterShape + finderInnerShape — 3つの角のパターン。安全性を重視するならsquareかroundedsquare、デザイン重視ならcircle / target / double。
  6. outputWidth + pixelsPerModule — どちらか一方を指定すれば、もう一方は自動計算されます。
  7. fileFormat — png、jpg、svg、pdf、webp。

グラデーション

{
  "foregroundStyle": "linearGradient",
  "gradientColors": ["#dcc28a", "#7d4bff"],
  "gradientDirection": "diagonal"
}

gradientDirection には vertical、horizontal、diagonal、diagonal-reverse、radial、または custom(gradientAngle: 0-360 と併用)を指定できます。

ロゴ

{
  "logoUrl": "https://yourbrand.com/logo.svg",
  "logoShape": "circle",
  "logoSizePercent": 18,
  "cleanBehindLogo": true,
  "eccLevel": "H"
}

logoSizePercent は、誤り訂正で復元できる範囲に収めるため、上限が 25 に制限されています。

フレームとテキストオーバーレイ

{
  "frame": {
    "enabled": true,
    "color": "#3d2a14",
    "width": 6,
    "cornerRadius": 14,
    "padding": 18,
    "shape": "rectangle"
  },
  "centerText": {
    "text": "ADMIT ONE",
    "color": "#3d2a14",
    "backgroundColor": "#f5ecd2",
    "height": 28,
    "fontSize": 13,
    "bold": true
  },
  "ctaText": "Scan to enter"
}

3つすべて(フレーム + 中央バナー + 下部のCTA)を組み合わせた例が、ショーケースのタイルチケットバナーです。

パラメータの全一覧

QrConfigリファレンスをご覧ください。エンジンが使うのと同じモデルから自動生成されるため、常に同期しています。