Barcode Reader

How to use the Barcode Reader

1. Drop or upload an image containing a barcode. PNG, JPEG, GIF, WebP, BMP, and SVG are all accepted; the file is loaded into a HTMLImageElement and never sent over the network.
2. Wait for detection. The page invokes the browser's BarcodeDetector once the image decodes. Detection typically resolves in tens of milliseconds for a clean photo, longer for a noisy or rotated source.
3. Read the result panel. Each detected barcode shows its format (EAN-13, Code 128, QR, etc.), the decoded value, and a Copy button for the value alone. Multiple barcodes in one image surface as a list.
4. Copy the value straight into a spreadsheet, an inventory system, an order lookup, or whatever was waiting on the decoded text.

What the reader does under the hood

The decode pipeline uses the W3C Shape Detection API's BarcodeDetector interface, exposed through window.BarcodeDetector. On instantiation, the page asks for the supported format list with BarcodeDetector.getSupportedFormats() and creates a detector configured with the formats this site advertises. The detector accepts an ImageBitmap, an HTMLImageElement, an HTMLCanvasElement, or a VideoFrame; the page passes the loaded image directly. Output is an array of DetectedBarcode objects, each carrying rawValue, format, and a corner-point bounding box.

BarcodeDetector is a browser-native API backed by the same machine-learned decoders Chrome ships for the camera. On Android, the underlying engine is ML Kit; on desktop Chromium, it is a portable C++ port of the same. Safari and Firefox have not implemented the API at the time of writing, so the page surfaces a clear "browser not supported" message and asks the user to switch to a Chromium-based browser. There is no client-side library doing decoding work, no WebAssembly bundle to load, and no upload step.

When this tool earns its keep

• Decoding a screenshot of a UPS or DHL tracking label sent by a colleague when their tracking system is down or behind a login wall.
• Reading the EAN-13 off a product photo in a vendor email to look up the catalog entry without typing 13 digits by hand.
• Pulling the contained URL out of a QR code in a marketing screenshot, a meeting room placard photo, or a printed onboarding flyer.
• Sanity-checking that a barcode generated by your own tooling round-trips correctly: produce, screenshot, and decode here to confirm the bytes match.
• Inventory triage: take a phone photo of a shelf with multiple SKUs and decode all visible barcodes in one pass.
• Auditing a printed warehouse label for damage by comparing the decoded value against the expected shipment number.

Common pitfalls and edge cases

• Browser support is the biggest gotcha. BarcodeDetector ships in Chromium-based browsers (Chrome, Edge, Opera, Brave, Vivaldi) on desktop and Android. Safari, Firefox, and iOS WebKit lack it. The page detects this and shows an explicit notice rather than failing silently.
• Linux Chrome support is partial. The desktop builds on Linux historically lacked barcode support because the underlying ML Kit components are not redistributable; Chrome 100+ on Linux now exposes the API but with a smaller format list. Verify with BarcodeDetector.getSupportedFormats().
• Low-contrast or skewed photos fail. Linear barcodes (EAN, UPC, Code 128) need crisp edges; the decoder rejects images where the bars blur into each other. Re-shoot with better light or higher resolution.
• Reflective surfaces eat data. Glossy product packaging photographed under direct light produces specular highlights that drop bars from the decode. Tilt the camera or shoot at an angle.
• SVG inputs need a rasterization step. Browsers decode SVG images at render time, but the resolution depends on the embedded viewBox and intrinsic size; very small SVG barcodes may fail. Convert to PNG at 1024px wide first.
• QR Code error correction masks failures. Even a partially obscured QR can decode because of Reed-Solomon error correction; the linear formats do not have that buffer and fail outright on the same level of damage.

Barcode formats and the standards behind them

EAN-13 and EAN-8 are governed by GS1 and codified in ISO/IEC 15420; UPC-A and UPC-E are the North American subset of the same family, defined first by the Uniform Code Council in 1973. Code 128 (ISO/IEC 15417) is a high-density linear format with three subsets (A, B, C) for different character classes, ubiquitous in shipping and logistics. Code 39 (ISO/IEC 16388) is the older alphanumeric workhorse used by the US military and the automotive industry; it is less dense than Code 128 but easier to print on low-resolution equipment. ITF (Interleaved 2 of 5, ISO/IEC 16390) is a numeric-only format optimized for outer cartons. QR Code is ISO/IEC 18004, a two-dimensional symbology with up to four levels of Reed-Solomon error correction; the BarcodeDetector returns the decoded UTF-8 payload, not the raw bit stream.

Alternatives and when they beat this tool

The open-source zxing library (Java, ports to JS, Swift, Kotlin) is the long-standing decoder used by Android's pre-ML-Kit era and remains the right pick when you need offline decoding inside an app. The html5-qrcode npm package is a smaller alternative for in-page camera scanning when you want a single-format decode loop. ZBar is the C/CLI option that ships in Linux distros (apt install zbar-tools) and decodes from the command line: zbarimg label.jpg. iPhone and recent Android cameras decode QR codes directly without any tool. This page wins when you have an image already in your browser, do not want to install a CLI or app, and do not want to upload the image to a remote service like online-barcode-reader.inliteresearch.com.