Skip to content

Manual mode

Manual mode exposes every dial the engine accepts. You'll find the same controls in the builder UI and in the API.

The 7 essentials

If you change nothing else, these are the ones that matter most:

  1. content — URL or text to encode.
  2. primaryColor + backgroundColor — must keep ≥ 4:1 contrast.
  3. eccLevel — L / M / Q / H. Default H. Required H if a logo is present.
  4. moduleShape — square / circle / roundedsquare / diamond / hexagon / dot / cross / star / leaf / pointed / drop.
  5. finderOuterShape + finderInnerShape — the 3 corner patterns. Square or roundedsquare for safety; circle / target / double for design.
  6. outputWidth + pixelsPerModule — pick one, the other is computed.
  7. fileFormat — png, jpg, svg, pdf, webp.

Gradient

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

gradientDirection accepts vertical, horizontal, diagonal, diagonal-reverse, radial or custom (with gradientAngle: 0-360).

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

logoSizePercent is capped at 25 to keep error correction within recoverable bounds.

Frames + text overlays

{
  "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"
}

Combining all three (frame + center banner + CTA below) is what the engine demos in the Banner ticket showcase tile.

Full parameter list

See QrConfig reference. It's auto-generated from the same models the engine uses, so it's always in sync.