index.qmd

---
title: Quarto-qrcode example
format:
  html: default
  pdf: default
---

Examples for <https://github.com/jmbuhr/quarto-qrcode>

# Usage

## HTML

`{{{< qrcode https://jmbuhr.de >}}}`
{{< qrcode https://jmbuhr.de >}}

`{{{< qrcode https://quarto.org >}}}`
{{< qrcode https://quarto.org >}}

You can supply an ID as the second argument (`qr1` and `qr2` in the next two examples), but it's not required.
Use keyword arguments to change the style of the qrcode ([available options](https://davidshimjs.github.io/qrcodejs/)).

`{{{< qrcode https://jmbuhr.de qr1 width=100 height=100 colorDark='#0011bb' >}}}`
{{< qrcode https://jmbuhr.de qr1 width=100 height=100 colorDark='#0011bb' >}}

`{{{< qrcode https://jmbuhr.de qr2 width=100 height=100 colorDark='#0011bb' >}}}`
{{< qrcode https://jmbuhr.de qr2 width=100 height=100 colorDark='#0011bb' >}}

Style your qrcodes with the `qrcode` css class on the surrounding div.

```html
<style>
.qrcode {
  margin-bottom: 1rem;
}
</style>
```

<style>
.qrcode {
  margin-bottom: 1rem;
}
</style>

## PDF

For options specific to pdf output such as the height of the qrcode in a unit that tex can understand,
append `pdf` to the name of the option to be passed to the [qrcode CTAN package]().

`{{{< qrcode https://jmbuhr.de qr1 width=100 height=100 pdfheigth=4cm >}}}`
{{< qrcode https://jmbuhr.de qr1 width=100 height=100 pdfheight=4cm >}}

`{{{< qrcode https://jmbuhr.de qr1 width=100 height=100 pdfnolink >}}}`
{{< qrcode https://jmbuhr.de qr1 width=100 height=100 pdfnolink >}}