Barcode Scanner

I added camera scanning to this tool after realizing the upload-an-image flow was too slow for the actual use case people had — standing in front of a product or a shipping label and just wanting the number, right now. But camera scanning surfaces a specific set of failure modes that image upload mostly avoids, and it's worth understanding why before you assume the barcode itself is broken.

How it works

Under the hood this uses ZBar, compiled to WebAssembly, running entirely in your browser tab. For a 1D barcode (the classic parallel-bars kind — UPC, EAN, Code 128), the decoder is measuring the exact widths of each bar and space along a scan line and matching that pattern of widths against the symbology's known encoding table. For 2D formats like QR codes, it's a different process — the decoder first locates the three large square "finder patterns" in the corners to establish orientation and scale, then reads the grid of small data modules inside. This is why 1D barcodes are far more sensitive to the angle of the scan line than QR codes are — a UPC code tilted 45° relative to the scan line can fail to decode, while a QR code held at almost any rotation still works, because the finder-pattern step corrects for orientation before the actual data gets read.

A real example

A worn shipping label with a Code 128 barcode where the middle third has faded from handling — the bars are still technically visible but the contrast has dropped enough that a phone camera in dim warehouse lighting can't distinguish bar from background reliably. Switching on the flashlight toggle and holding the phone 15cm from the label (closer than feels natural) usually fixes it, because it increases the light hitting the faded area enough to restore contrast. If that doesn't work, uploading a photo taken with a proper camera flash and letting the tool process a static image — rather than a live, slightly-shaky video feed — often succeeds where live scanning fails, since a single sharp frame beats a stream of slightly-blurred ones.

Common mistakes

• Scanning too close or too far. Every barcode format has bar widths tuned to a expected scanning distance. Too close and the camera can't fit the full code in frame with margin; too far and the bars blur below the camera's resolvable width. Start around 15-20cm and adjust.
• Not leaving quiet zone margin around the barcode. If the camera frame or a crop cuts right up against the first and last bars with no white space margin, decoders can misread the boundary. A little empty space on either side of the code, included in frame, actually helps.
• Assuming a scan failure means the barcode is invalid. Most failures are lighting, angle, or distance — not a broken barcode. Before concluding the code itself is bad, try the upload-image path with a well-lit, straight-on photo; if that also fails consistently, then the barcode itself likely has print or damage issues.