@larscom/ng-qrcode-svg

@larscom/ng-qrcode-svg

Simple and powerful QR code generator (SVG only) for Angular.

✨ Live Demo

Installation

npm install @larscom/ng-qrcode-svg

Usage

1. Import module QrcodeSvgModule

import { NgModule } from '@angular/core';
import { QrcodeSvgModule } from '@larscom/ng-qrcode-svg';

@NgModule({
  imports: [
    QrcodeSvgModule // <-- import
  ]
})
export class MyModule {}

1. Use the qrcode-svg component which will render a QR code in SVG format

<qrcode-svg value="hello world!"></qrcode-svg>

Component Properties

Name	Description	Default
@Input() value: string;	The value to encode (turns into QR code)	undefined
@Input() ecc: 'low' | 'medium' | 'quartile' | 'high';	Error correction level	medium
@Input() borderSize: number;	The padding between the edge and the QR code (quiet zone)	2
@Input() size: string | number;	The size of the QR code SVG (px,em,rem)	250
@Input() backgroundColor: string;	The 'path' color (background)	#FFFFFF
@Input() foregroundColor: string;	The 'rect' color (foreground)	#000000
@Input() alt: string | undefined;	HTML alt attribute	undefined
@Input() ariaLabel: string | undefined;	HTML aria-label attribute	undefined