QR-Code extension

Are you looking for an easy way to display QR-Codes in your PDF. Typeset.sh provides a little extension that can help with that. Since it is not HTML standard it must be installed separately, unless you are using the PHAR, the extension ships with it.

To install it, use composer and require typesetsh/qr-code-element


        composer require typesetsh/qr-code-element

Once installed you can use the qr-code element in your html. This element supports the alt attribute as well as icon-src and icon-size attribute. Both can be used to place and size an icon in the center of your qr-code. The size is an integer, where 1 equals one block size (a single block-bit so to say).


    
    <qr-code icon-src="icon.png" icon-size="3">DATE_GOES-HERE</qr-code>

The element content is the data to be encoded in the qr-code. Please note, whitespaces are not trimmed! You can also use CSS styles to change the color of the qr-code (color: red;) though double check that a scanner is still decode it. It is also good practise to have at least 5mm of margin.

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>QR Code</title> <style> @page { size: 10cm 10cm; margin: 10mm; background: black; } body { text-align: center; color: white; } #qr { display: inline-block; width: 3cm; color: dimgrey; } </style> </head> <body> <h1>QR Code</h1> <p>Generating a simple qr-code.</p> <qr-code id="qr" icon-src="https://typeset.sh/images/favicon-96x96.png" icon-size="7" alt="QRCode to typeset.sh">https://typeset.sh/en/php/extensions/qr-code/</qr-code> <p>test me</p> </body> </html>

CSS API PHP CMD QR