Component

QR code

A scannable code rendered client-side from any string value, with optional custom colors and a center logo.

Standalone

qr code.tsx

<NativeQRCode value="ACCT-8842-1190-2256-7731" size={180} />

Paired with the underlying value rendered as text beneath it, so the code stays useful even when a scanner isn't handy.

ACCT-8842-1190-2256-7731

qr-code-example.tsx

<NativeQRCode value={value} size={160} />
<span className="text-xs text-muted-foreground">{value}</span>