The snippet below illustrates the use of the HTML5 Canvas tag on a HTML page.
Input Data: elementBarcode.innerHTML (or any other input string)
Error Correction Level: "L" ("L", "M", "Q" or "H")
L - Allows recovery of up to 7% data loss
M - Allows recovery of up to 15% data loss
Q - Allows recovery of up to 25% data loss
H - Allows recovery of up to 30% data loss
Mask: 8 (0 to 7 or 8 for Auto)
The purpose of a mask pattern is to make the QR code easier for QR scanner to read.
The QR Code Barcode WOFF fonts provided by ConnectCode have been tested vigorously to display and print on different desktop and mobile browsers. It is important to know that a font raster to the output device and is not limited to DPI (Dots per Inch) of the computer screen. This enables very high quality QR Code barcodes to be generated.
The font solution for generating barcodes is based on ConnectCode’s True Type barcode font engine that has passed numerous independent audits and is widely adopted by many Fortune 500 companies. QR Code fonts in Embedded Open Type (EOT), and Open Type (OTF) format are also provided to ensure that the solution works on legacy browsers that have yet to fully support WOFF.
@font-face BarcodeThe Cascading Style Sheets (CSS) @font-face feature is used to specify an online font for display on web pages. This eliminates the need to depend on the pre-installed fonts on computers. The following illustrates the font-face tag in the site.css file.
Applying the font-face to the qrBarcodeFonts div element:
Supported Browsers and PlatformsConnectCode Certified
- Internet Explorer 11 (Windows 7/8/10)
- Microsoft Edge (Windows 8/10)
- Opera 40+ (Windows)
- Google Chrome 61+ (Windows)
- Google Chrome 61+ (OS X/macOS/Big Sur/Monterey)
- Safari 5.1+ (OS X/macOS)
- iOS Mobile Browser (iOS 10.0+)
- Android Mobile Browser (Android 4.0+)
- Mozilla Firefox (57+)
Please note that though our QR Code Barcode Web Fonts/HTML5 Canvas solution works on many more browsers, we currently only provide technical support for the above-mentioned certified browsers.
Download QR Code Barcode package.
Back to QR Code Barcode Fonts.