QRdx vs qrcode.react

qrcode.react is the lightweight, permissively licensed standard. QRdx builds on its encoder and adds patterns, gradients, templates and download helpers.

QRdx vs qrcode.react
at a glance

Pricing, design options and developer tooling side by side. Where qrcode.react is ahead, the table says so.

Compare

npm · AGPL-3.0

npm · ISC

License

AGPL-3.0

ISC

Downloads (last 30 days)

About 39.5 million

Latest version

0.0.46

4.2.0

Runtime dependencies

Several (PDF, scanning, validation)

None

SVG and canvas rendering

Logo with excavation

Body, eye and eye-dot shapes

9 · 9 · 11

Square modules only

Gradients

Linear + radial

Frame templates

PNG/JPG/SVG/PDF download helpers

Visual editor that exports code

Why choose QRdx over qrcode.react?

The areas where QRdx is the stronger pick. The guide below also covers where qrcode.react is the better choice.

Styling built in

qrcode.react renders standard square modules with a foreground and background color. QRdx adds 9 body patterns, 9 eye shapes, 11 eye-dot shapes, separate eye and dot colors, and linear or radial gradients.

Downloads included

QRdx ships helpers to download a code as PNG, JPG, SVG or PDF. With qrcode.react you write that export code yourself.

Design it visually first

Style a code in the QRdx playground, then copy it as a ready-to-paste QRCode component with the same props.

Same encoder lineage

QRdx's renderer builds on qrcode.react's QR encoding code (credited under its ISC license in the source), so the core encoding is battle-tested.

QRdx or qrcode.react: which should you use?

If you need a QR code in a React app, qrcode.react is the default choice, and for good reason. It is tiny, has no runtime dependencies, supports every React version from 16.8 to 19, and is used enormously: about 39.5 million npm downloads in the last 30 days, against 63 for QRdx's qrdx package. QRdx actually builds on qrcode.react's encoder, and its source credits it under the ISC license.

Who each library is for

qrcode.react is for apps that need a correct, plain QR code with minimal weight. It exports QRCodeSVG and QRCodeCanvas, with props for size, error-correction level, colors, margin, title, minimum version and an embedded image with excavation.

QRdx is for apps where the code is part of the brand: custom body patterns, eye shapes, gradients, frames and built-in downloads, plus a visual playground that exports the matching component code.

Where qrcode.react is the better choice

Licensing. qrcode.react is ISC, a permissive license that is easy to ship in closed-source products. QRdx is AGPL-3.0, a strong copyleft license; check with your legal team before using it in proprietary software.
Bundle size. qrcode.react has no runtime dependencies. QRdx depends on jsqr and zod for scanning and validation; jspdf is an optional peer dependency, needed only for PDF export.
Maturity. qrcode.react is on version 4 with a very large user base. QRdx is pre-1.0 and its API may still change.
Older React. qrcode.react supports React 16.8 and up.

Key differences

Styling: qrcode.react supports foreground and background colors and a logo. QRdx adds patterns, eye styles, gradients and templates.
Export: QRdx includes download and data-URI helpers for PNG, JPG, SVG and PDF.
Extras: QRdx includes a contrast checker and QR detection utilities.

Switching from qrcode.react

Install with npm install qrdx.
Replace QRCodeSVG with the QRCode component from qrdx. The value, size, level, bgColor and fgColor props carry over.
Add bodyPattern, cornerEyePattern and cornerEyeDotPattern, or design the code in the playground and copy the generated component.
Read the docs for logos, gradients and download helpers, and confirm the license fits your project.