oss.sarwagya.wtf

Rendering a QR code

The artifact is the payload; the QR library is your choice.

Handoff core contains no QR rendering on purpose — a QR code is one way to display an artifact, and the protocol must not depend on how the artifact is drawn. Any QR library that renders a string works:

import { renderSVG } from "uqr";
 
const offer = await handoff.create(state);
 
if (offer.qrFriendly) {
  const svg = renderSVG(offer.url);
  element.innerHTML = svg;
}

Render offer.url (not the bare artifact) so any camera app opens the receive page directly — the scan is the navigation.

Making codes that actually scan

  • Respect qrFriendly. Past ~1,000 artifact characters, show a copyable link instead. Dense codes fail quietly and users blame their phones.
  • Render big and high-contrast. On screens, 240px+ with black modules on white survives glare and cheap cameras; skip styling gimmicks.
  • Medium error correction is plenty for screen-to-camera. High EC levels shrink capacity for damage resistance that screens don't need.
  • Leave the quiet zone alone. The white border is part of the spec, not wasted space.