The example below loads live from Storybook; you can open the controls there.
With a caption
Section titled “With a caption”caption writes the payment reference and the domain to compare under the code. The QR code must never be the only way to reach the content.
With a logo
Section titled “With a logo”logo puts a small mark in the centre. The mark covers some modules, so the code is encoded at error correction level Q.
size is the side length, quiet zone included; the code shrinks to fit a narrower container.
Light and dark mode
Section titled “Light and dark mode”The QR code is drawn with dark modules on a light background in every mode and in print; scanners cannot always read inverted codes. The caption uses the theme colours.