1. Web
  2. Web APIs
  3. Barcode Detection API

Barcode Detection API

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Want more browser support for this feature? Tell us why.

Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

Note: This feature is available in Web Workers.

Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

The Barcode Detection API detects linear and two-dimensional barcodes in images.

Concepts and usage

Support for barcode recognition within web apps unlocks a variety of use cases through supported barcode formats. QR codes can be used for online payments, web navigation or establishing social media connections, Aztec codes can be used to scan boarding passes and shopping apps can use EAN or UPC barcodes to compare prices of physical items.

Detection is achieved through the detect() method, which takes an image object; it can be one of these objects: a HTMLImageElement, a SVGImageElement, a HTMLVideoElement, a HTMLCanvasElement, an ImageBitmap, an OffscreenCanvas, a VideoFrame, a Blob, or an ImageData. Optional parameters can be passed to the BarcodeDetector constructor to provide hints on which barcode formats to detect.

Supported barcode formats

The Barcode Detection API supports the following barcode formats:

Format Description Image
aztec A square two-dimensional matrix following iso24778 and with a square bullseye pattern at their center, thus resembling an Aztec pyramid. Does not require a surrounding blank zone. A sample image of an Aztec barcode. A square with smaller black and white squares inside
code_128 A linear (one-dimensional), bidirectionally-decodable, self-checking barcode following iso15417 and able to encode all 128 characters of ASCII (hence the naming). An image of a code-128 barcode. A horizontal distribution of vertical black and white lines
code_39 A linear (one-dimensional), self-checking barcode following iso16388. It is a discrete and variable-length barcode type. An image of a code-39 barcode. A horizontal distribution of vertical black and white lines
code_93 A linear, continuous symbology with a variable length following bc5. It offers a larger information density than Code 128 and the visually similar Code 39. Code 93 is used primarily by Canada Post to encode supplementary delivery information. An image of a code 93 format barcode. A horizontal distribution of white and black horizontal lines
codabar A linear barcode representing characters 0-9, A-D and symbols - . $ / + An image of a codabar format barcode. A horizontal distribution of black and white vertical lines
data_matrix An orientation-independent two-dimensional barcode composed of black and white modules arranged in either a square or rectangular pattern following iso16022. An example of a data matrix barcode. A square filled with smaller black and white squares