Capabilities
- Generates QR codes from any string data
- Uses shadcn/ui CSS variables
--foregroundand--background - Supports custom foreground and background colors
- Renders as SVG for crisp display at any size
- Fully responsive with automatic sizing
Variations
- Styling
The QR code is wrapped in a div so you can pass in a custom class name to style it.
- Robustness
You can change the robustness of the QR code by passing the robustness prop. Higher levels offer a better error resistance but reduce the symbol's capacity.
- Server Component
You can also use the QRCode component as a React Server Component, however you'll need to pass in the foreground and background prop manually as hex values.