Awesome

<img title="Algorand QR Code Generator (Banner art by Stasya Tikhonova, curtsey of Algorand)" src="./examples/images/algorand-qrcode-banner.jpg">

Algorand QR Code Generator V3.2.0

New version 3 is a complete re-write of the Algorand QRCode generation tool. Simpler and more effective!

Breaking changes: The way to import and some of options have changed , please consult this readme.

Demo

Live Demo

Links

Algorand Developers Portal Publication

Algorand Dev Hours Presentation

Algorand Dev Hours Presentation Video on YouTube

News

Version 3.2.0 is now here!

Now completely supports any modern web framework

Modern JS Module in both Node and Browser

Technical notes

• Amount is in MicroAlgos

• Algorand URI reference specification: Algorand payment prompts specification.

• Requires NodeJS version later than 10.

Table of contents

• Highlights
• Algorand URI's ABNF Grammar
• Installation
• Usage
• Error correction level
• Mentioned Trademarks
• Credits
• License

Highlights

• Supports NodeJS and Browser.
• Supports RFC 3986 and Algorand URI ABNF Grammar.
• CLI utility.
• Save QR code as valid SVG image or text

Algorand URI ABNF Grammar

    algorandurn     = "algorand://" algorandaddress [ "?" algorandparams ]
    algorandaddress = *base32
    algorandparams  = algorandparam [ "&" algorandparams ]
    algorandparam   = [ amountparam / labelparam / noteparam / assetparam  ]
    amountparam     = "amount=" *digit
    labelparam      = "label=" *qchar
    assetparam      = "asset=" *digit
    note            = "note=" *qchar

Installation and use

npm install --save algorand-qrcode

and then

import algoqrcode from "algorand-qrcode/lib/bundle.min.js"

or, install it globally to use qrcode cli command to generate Algorand URI qrcode images in your terminal.

npm install -g algorand-qrcode

and then

algoqrcode [options]

Usage

Browser and Frameworks (react...) use

import algoqrcode from "algorand-qrcode/lib/bundle.min.js";
const MyQrCodeComponent = (props)=>{
  let qrcode = algoqrcode({wallet:props.wallet, label:props.label})
  let scg = qrcode.svg()
  return svg
}
 
      

CLI

Usage: algoqrcode [options]

Algorand options:
  -m, --amount Amount (in Micro Algos) of Algorand transaction          [number]
  -w, --wallet Destination Wallet address (Algorand account address)      [string]
  -l, --label Label of Algorand transaction                             [string]
  -a, --asset Algorand asset id (in case of Algorand ASA transfer)      [string]
  -n, --note note                                                       [string]

QR Code options:
              
  -e, --ecl     Error correction level           [choices: "L", "M", "Q", "H"]



Renderer options:
  -o, --output        Output type           [choices: "file", "svg", "terminal"]
  -w, --wallet        Destination wallet                                [number]
  -p, --padding       Padding around QRcode                             [number]
  -b, --background    Light color                                       [string]
  -c, --color         Dark color                                        [string]
  -s, --size          QRcode image width and height (px)                [number]
  -f, --file          Output file                                       [string]


Options:

  -h, --help    Show help                                              [boolean]
  --version     Show version number                                    [boolean]

Examples:
    - Send 1 Algo transaction:
    algoqrcode -w "AMESZ5UX7ZJL5M6GYEHXM63OMFCPOJ23UXCQ6CVTI2HVX6WUELYIY262WI" -m 1000000 -s 128 -n "This is an Algo payment transaction QR Code"

    - Save Algorand contact label as svg image:
    algoqrcode -w "AMESZ5UX7ZJL5M6GYEHXM63OMFCPOJ23UXCQ6CVTI2HVX6WUELYIY262WI" -l "emg110@gmail.com" -o file -f sample.svg 

NodeJS

Import the module algorand-qrcode for your NodeJS module

        import algoqrcode from 'algorand-qrcode'
        let qrcode = algoqrcode({
            wallet: "AMESZ5UX7ZJL5M6GYEHXM63OMFCPOJ23UXCQ6CVTI2HVX6WUELYIY262WI",
            label: "Test Label",
            output: "svg",
            size:256
        })
        let svg = qrcode.svg()
        console.log(svg)

Error correction level

Error correction capability allows to successfully scan a QR Code even if the symbol is dirty or damaged. Four levels are available to choose according to the operating environment.

Higher levels offer a better error resistance but reduce the symbol's capacity.<br> If the chances that the QR Code symbol may be corrupted are low (for example if it is showed through a monitor) is possible to safely use a low error level such as Low or Medium.

Possible levels are shown below:

The percentage indicates the maximum amount of damaged surface after which the symbol becomes unreadable.

Error level can be set through options.ecl property.<br> If not specified, the default value is M.

QR Code options

errorCorrectionLevel

Type: String<br> Default: M

Error correction level.<br> Possible values are low, medium, quartile, high or L, M, Q, H.

Algorand URI params

wallet

Type: String<br>

Wallet address for Algorand transaction.

amount

Type: Number<br>

Amount of Algorand transaction in MicroAlgos or Standard Asset Unit.

label

Type: String<br>

Label of Algorand transaction.

asset

Type: String<br>

Asset Id of Algorand transaction if used. If not specified , Algo will be used as fungible token.

note

Type: String<br>

note field content of Algorand transaction.

Renderers options

ecl

Type: String<br> Default: M

Define the error correction level.

padding

Type: Number<br> Default: 5

Define how much wide the quiet zone should be.

size

Type: Number<br> Default: 128

Width and height.

color

Type: String<br> Default: #000000ff

Color of dark module. Value must be in hex format (RGBA).<br> Note: dark color should always be darker than color.light.

background

Type: String<br> Default: #ffffffff

Color of light module. Value must be in hex format (RGBA).<br>

License

MIT

Credits

Special appreciations to Sheghzo.

The idea for this lib was inspired by: Algorand developers portal Article Payment Prompts with Algorand Mobile Wallet ,from Jason Paulos.

Mentioned Trademarks

"QR Code" curtsey of :<br> <img title="DENSO WAVE Incorporated" src="https://milliontech.com/wp-content/uploads/2017/01/Denso-Wave-Logo-300x102.png" height="auto" width="128">

"Algorand" curtsey of:<br> <img title="Algorand Technologies" src="https://www.algorand.com/assets/media-kit/logos/full/png/algorand_full_logo_black.png" height="auto" width="128">