Pure JavaScript QR Code Generator – QRious

QRious is a simple, dependency-free JavaScript library which uses HTML5 canvas to generate QR codes with variable colors, sizes and error correction levels.

Installation:

# NPM
$ npm install qrious --save

How to use it:

Link to the needed JavaScript file qrious.js as follow:

<script src="qrious.js"></script>

Create an html canvas element on which you want to draw a custom QR code.

<canvas id="qr"></canvas>

Create a new QRious object and draw a custom QR code on the canvas element you created.

var qr = new QRious({
      element: document.getElementById('qr'),
      value: 'Custom value'
})

More options to customize the QR code.

var qr = new QRious({
    element: document.getElementById('qr'),
    value: 'Custom value',
    background: 'white', // background color
    foreground: 'black', // foreground color
    backgroundAlpha: 1,
    foregroundAlpha: 1,
    level: 'L', // Error correction level of the QR code (L, M, Q, H)
    mime: 'image/png', // MIME type used to render the image for the QR code
    size: 100, // Size of the QR code in pixels.
    padding: null // padding in pixels
})

Generates a base64 encoded data URI for the QR code.

qr.toDataURL([mime type])

Changelog:

v4.0.2 (08/29/2018)

• Update