QR codes

import { QrCode } from "@pictum/react";

<QrCode
  value="https://pictum.dev"
  format="svg"
  aria-label="Open Pictum"
  className="size-32"
/>

<script setup lang="ts">
import { QrCode } from "@pictum/vue";
</script>

<template>
  <QrCode
    value="https://pictum.dev"
    format="svg"
    aria-label="Open Pictum"
    class="size-32"
  />
</template>

<x-qr-code
  value="https://pictum.dev"
  format="svg"
  aria-label="Open Pictum"
  class="size-32"
/>

<script type="module">
  import { definePictumElements } from "@pictum/web";

  definePictumElements();
</script>

<pictum-qr-code
  value="https://pictum.dev"
  format="svg"
  alt="Open Pictum"
  class="size-32"
></pictum-qr-code>

import { qrCode } from "@pictum/react";

// Generate a PNG URL without making a request.
const url = qrCode("https://pictum.dev", {
  format: "png",
}).url;

// Fetch canonical SVG markup.
const svg = await qrCode("https://pictum.dev").svg();

// Generate a PNG URL without making a request.
$url = Pictum\qrCode(
    'https://pictum.dev',
    format: 'png',
)->url();

// Fetch canonical SVG markup.
$svg = Pictum\qrCode('https://pictum.dev')->svg();