OOratiq

QR Code

Ready

Generate a themed QR code.

Installation

$ npx @oratiq-js/ui add qr-code

Copies the component and everything it depends on into your project, then lists the npm packages to install. The code is yours after this.

Usage

import
import { QRCode } from "@/components/ui/qr-code";

Behaviour

  • Renders as SVG and inherits the foreground token — the code follows your theme in both modes.
  • role=img with the value (or your label) spoken — a QR is content, not decoration.
  • Machine-read geometry: never mirrored under RTL.
  • Raise the error-correction level to H if you overlay a logo.

Props

PropTypeDefaultDescription
value*string—The encoded text or URL.
sizenumber160Rendered size in px.
level"L" | "M" | "Q" | "H""M"Error correction.

View source on GitHub → components/ui/qr-code.tsx