Data Display

QR Code

A themeable QR code — dots follow the foreground color and re-tint when the theme flips.

Import

import { QRCode, QRCodeGradientScan } from "@countryclub/ui-react";

Default

Sizes

Three sizes via the "size" prop: "sm", "md" and "lg".

Custom Styling

Override dot colors and embed a center logo via the options prop (qr-code-styling options).

Gradient Scan

Overlay a QRCodeGradientScan inside a relative wrapper for an animated scanning sheen.