Build QR codes with a single TypeScript-first API, then render them in the format your app needs.
npm install @qrcodesdk/corepnpm add @qrcodesdk/coreOther package managers
vp
vp add @qrcodesdk/coredeno
deno add @qrcodesdk/corebun
bun add @qrcodesdk/coreyarn
yarn add @qrcodesdk/coreRender a scalable SVG string with the runtime-neutral Core package:
import {QRCodeSVGRenderer, qrcode} from '@qrcodesdk/core';
const svg = qrcode('https://qrcodesdk.dev').render(QRCodeSVGRenderer());SVG is the recommended default for most user-facing QR codes: it stays sharp at any size and works in browsers, servers and static assets. See the SVG renderer reference when you need its options or exact return contract.
| Where will it run? | Output you need | Start here |
|---|---|---|
| Any supported JavaScript runtime | SVG or terminal text strings | @qrcodesdk/core |
| Browser DOM | Canvas, PNG-backed Image element, or file download | @qrcodesdk/browser |
| Node.js-compatible runtime | PNG Buffer for files or responses |
@qrcodesdk/node |
| React or Next.js | SVG, Image, or Canvas component | @qrcodesdk/react |
| Vue | SVG, Image, or Canvas component | @qrcodesdk/vue |
| Svelte | SVG, Image, or Canvas component | @qrcodesdk/svelte |
| Angular | SVG, Image, or Canvas component | @qrcodesdk/angular |
| Terminal, shell script, or CI | Terminal text, SVG file, or PNG file | @qrcodesdk/cli |
Choose your setup for the matching install command, or compare every built-in return type in Renderer outputs.
Try the Playground to explore appearance visually, or follow Customize appearance to style the SVG you just rendered.