Barcode & QR Tools

1D barcodes (linear barcodes) encode data in the widths of parallel black and white bars. They're used for retail products (UPC-A, EAN-13), shipping labels (Code 128), and library books (Code 39). 1D barcodes can only encode a small amount of data (typically 8-20 characters) and must be scanned with a laser or linear imager. The encoding algorithm converts each character into a specific pattern of bars and spaces -- for example, Code 128 uses 11 modules per character, with each module being either a black bar or a white space.

2D codes (matrix codes) encode data in a two-dimensional grid of black and white squares. QR codes (Quick Response) are the most common 2D code, capable of storing up to 7,089 numeric characters or 4,296 alphanumeric characters. They include error correction (Reed-Solomon) that allows the code to be read even if partially damaged or obscured -- up to 30% of the code can be damaged and still be readable. QR codes are used for URLs, contact information (vCard), WiFi credentials, payment links, and boarding passes.

The choice between 1D and 2D depends on the use case. For retail products with simple numeric identifiers, UPC-A or EAN-13 is standard. For shipping and logistics, Code 128 is preferred because it can encode alphanumeric data. For marketing, payments, and information sharing, QR codes are the best choice because they can encode URLs, text, and structured data that smartphones can interpret directly.

Barcode generation converts input data into a visual pattern. For QR codes, the process involves: encoding the data into a bit stream, adding error correction codes using Reed-Solomon, arranging the bits into a matrix, applying masking patterns to ensure readability, and adding position, alignment, and timing patterns. The resulting matrix is rendered as black and white squares on a canvas. The canvas can then be exported as PNG for download.

Barcode scanning (decoding) reverses this process. The Barcode Detection API (available in Chrome, Edge, and Opera) uses the device's camera or an uploaded image to detect and decode barcodes. It analyzes the image to find the barcode's position, then reads the pattern of bars/squares and decodes the data. For camera-based scanning, the API continuously processes video frames from the getUserMedia stream, detecting barcodes in real time. The API supports multiple barcode formats simultaneously -- it can detect both a 1D barcode and a QR code in the same frame.