Browser download renderers

When to use

Use the download renderers inside a browser user action when the SDK should create and click a temporary download link. Use the SVG wrapper for scalable files and the Image wrapper for PNG files.

Minimal example

import {QRCodeDownloadSVGRenderer} from '@qrcodesdk/browser';
import {QRCodeSVGRenderer, qrcode} from '@qrcodesdk/core';

qrcode('https://qrcodesdk.dev').render(
  QRCodeDownloadSVGRenderer({
    renderer: QRCodeSVGRenderer(),
    filename: 'qrcode',
  }),
);

For PNG, wrap QRCodeImageRenderer() with QRCodeDownloadImageRenderer() instead.

Return value

Both wrappers return void. Their effect is a browser download; they do not return the wrapped SVG string or Image element.

Renderer-specific options

Wrapper	renderer requirement	filename default	Added extension
QRCodeDownloadSVGRenderer	QRCodeRenderer<string> such as QRCodeSVGRenderer()	'qrcode'	.svg
QRCodeDownloadImageRenderer	QRCodeRenderer<HTMLImageElement> such as QRCodeImageRenderer()	'qrcode'	.png

renderer is required. filename is optional; the wrapper appends its extension when the supplied name does not already end with that extension, using a case-insensitive check.

Renderer-specific constraints

• Both wrappers require browser DOM download behavior and must be called in a context where the browser permits a programmatic link click.
• The SVG wrapper creates an image/svg+xml;charset=utf-8 Blob and revokes its object URL on the next task after triggering the download.
• The PNG wrapper downloads the wrapped Image element’s existing src; it does not re-encode it.
• Wrapped renderer options, output validity, and runtime requirements remain the responsibility of the wrapped renderer.

Related guides

• Download or save for choosing SVG or PNG and for framework component, Canvas, and Node.js workflows.
• SVG string renderer and PNG-backed Image element renderer for wrapped options.