Skip to main content

QR code type

Usage​

To use any of the functions described on this page, you must prefix them with the QRCode type name:

QRCode.generate("some text")

Generate function​

Generates the QR code of the given text and returns the SVG representation of it.
Syntax: generate(text, darkColor, lightColor, errorCorrectionLevel)

  • The first parameter is required and is the text of which the QR code gets generated (type: text, max length: 500 characters)
  • The second parameter is optional and defines the main color of the QR code (type: color, default value: #000)
  • The third parameter is optional and defines the background color of the QR code (type: color, default value: #FFF)
  • The fourth parameter is optional and defines the error correction level of the QR code (type: number, default value: 0). Possible values:
    • <=1 - Level L (Low) - 7% of codewords can be restored
    • 2 - Level M (Medium) - 15% of codewords can be restored
    • 3 - Level Q (Quartile) - 25% of codewords can be restored
    • >=4 - Level H (High) - 30% of codewords can be restored
QRCode.generate("some text a")
QRCode.generate("some text b", "#F00".toColor())
QRCode.generate("some text c", "#012".toColor(), "#ABC".toColor())
QRCode.generate("some text d", "#00D".toColor(), "#F0F".toColor(), 3)

The SVG QR code scales to any width/height needed. If you put the SVG into a visual in a graphic component and set the height/width, it will scale to this size accordingly.

Tips for improving the readability of the QR code:

  • Always leave a space between your QR code and the content or design around it. The QR code should always stand alone in the background and the foreground should not touch other elements.
  • Make sure there is enough contrast when using other colors than black and white.
  • Don’t put too much content into a QR code. Use a low error correction level for smaller QR codes.