SVG QR Code Generator

by Jesse M

HTML

<div>
<p>line 1</p>
<p>line 2</p>
<h1>header</h1>
<p>line 3</p>
<p>line 4</p>
<p>line 5</p>
</div>
<img src="" />

CSS

h1 ~ p {
  color: #F00;
}

h1 + p {
  color: #000;
}

JavaScript

import QrCode from 'https://danielgjackson.github.io/qrcodejs/qrcode.mjs';

    const data = 'https://maximument.com/gamescom';
    const matrix = QrCode.generate(data);
    const uri = QrCode.render('svg-uri', matrix);
    document.querySelector('img').src = uri;