QrCode
QrCode component.
Qrcode, Customization Blocks
<x-qr-code link="https://tallstackui.com" />
<!-- Without color the modules follow the theme --><x-qr-code link="https://tallstackui.com" /> <!-- A named color is the same color under both themes --><x-qr-code link="https://tallstackui.com" color="blue" /><x-qr-code link="https://tallstackui.com" color="emerald" />
<x-qr-code link="https://tallstackui.com" size="xs" /><x-qr-code link="https://tallstackui.com" size="sm" /><x-qr-code link="https://tallstackui.com" size="md" /><x-qr-code link="https://tallstackui.com" size="lg" /><x-qr-code link="https://tallstackui.com" size="xl" /><x-qr-code link="https://tallstackui.com" size="2xl" />
<!-- An icon name draws the icon --><x-qr-code link="https://tallstackui.com" watermark="bolt" size="lg" /> <!-- Anything else is drawn as text, capped at 8 characters --><x-qr-code link="https://tallstackui.com" watermark="TALL" size="lg" />
<x-qr-code link="https://tallstackui.com" copy /><x-qr-code link="https://tallstackui.com" download /><x-qr-code link="https://tallstackui.com" download="svg" /><x-qr-code link="https://tallstackui.com" copy download="svg" />
An option to display a lazy loading skeleton indicator.
<x-qr-code :link="$resolved" :skeleton="$resolved === null" size="lg" />