# mebjas/html5-qrcode

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/mebjas-html5-qrcode).**

6,030 stars · 1,130 forks · TypeScript · apache-2.0

## Links

- GitHub: https://github.com/mebjas/html5-qrcode
- Homepage: https://qrcode.minhazav.dev
- awesome-repositories: https://awesome-repositories.com/repository/mebjas-html5-qrcode.md

## Topics

`barcode` `camera` `html5` `javascript` `qrcode` `scanning`

## Description

html5-qrcode is a client-side JavaScript library that enables QR code and barcode scanning directly in a web browser, processing live video from a device camera or decoding codes from uploaded image files without any server-side involvement. The library handles real-time scanning from continuous camera feeds with adjustable frame rates and scanning regions, while also supporting file-based decoding for static images.

The scanner offers configurable behavior through runtime settings, allowing developers to adjust scanning speed, viewfinder region, aspect ratio, and restrict decoding to specific 1D or 2D code formats. It provides callback-driven result handling for successful code detection, scan failures, and video stream errors, with automatic scan termination after a successful read to prevent redundant processing. Camera controls include inline switching between available cameras, torch and zoom adjustment during scanning, and the ability to capture high-resolution video for small or distant codes.

The library supports both camera and file scanning modes, which can be configured independently or combined into a single interface. It includes a multilingual interface system for displaying the scanner in languages other than English, and provides programmatic control to stop scanning sessions and clean up camera resources on demand.

## Tags

### Part of an Awesome List

- [Browser-Based Scanners](https://awesome-repositories.com/f/awesome-lists/devtools/qr-codes/browser-based-scanners.md) — Enables QR code and barcode scanning directly in a web browser from camera or image files.
- [QR Codes](https://awesome-repositories.com/f/awesome-lists/devtools/qr-codes.md) — Provides real-time QR code scanning from continuous camera video with adjustable frame rate and region.
- [Camera-Based Scanners](https://awesome-repositories.com/f/awesome-lists/devtools/qr-codes/camera-based-scanners.md) — Captures live camera video and decodes QR codes and barcodes in real time within a web page.
- [Camera QR Code Scanners](https://awesome-repositories.com/f/awesome-lists/devtools/qr-codes/camera-qr-code-scanners.md) — Captures live camera video and decodes QR codes and barcodes in real time from the feed. ([source](https://qrcode.minhazav.dev/HTML5-QR-Code-scanning-support-for-local-file-and-default-camera/))
- [Image File Barcode Decoders](https://awesome-repositories.com/f/awesome-lists/devtools/qr-codes/document-qr-code-decoders/image-file-barcode-decoders.md) — Decodes QR codes and barcodes from user-selected image files without server uploads. ([source](https://qrcode.minhazav.dev/HTML5-QR-Code-scanning-support-for-local-file-and-default-camera/))
- [Dual-Mode Scanners](https://awesome-repositories.com/f/awesome-lists/devtools/qr-codes/dual-mode-scanners.md) — Provides a unified interface for scanning codes from both camera and image file sources. ([source](https://github.com/mebjas/html5-qrcode/wiki/Feature-request-sponsorship-goals))
- [Camera or File Scanning Mode Selections](https://awesome-repositories.com/f/awesome-lists/media/camera-and-media/camera-or-file-scanning-mode-selections.md) — Configures the scanner to use only the camera, only file upload, or both, and sets the default scan mode. ([source](https://cdn.jsdelivr.net/gh/mebjas/html5-qrcode@master/README.md))
- [Inline Camera Switchers](https://awesome-repositories.com/f/awesome-lists/media/camera-and-media/inline-camera-switchers.md) — Switches between available cameras inline without interrupting the active scanning session. ([source](https://github.com/mebjas/html5-qrcode/wiki/Feature-request-sponsorship-goals))

### Artificial Intelligence & ML

- [Barcode Decoders](https://awesome-repositories.com/f/artificial-intelligence-ml/barcode-decoders.md) — Decodes QR codes and barcodes from user-selected image files entirely on the client side. ([source](https://qrcode.minhazav.dev))
- [Camera Feed Decoders](https://awesome-repositories.com/f/artificial-intelligence-ml/barcode-decoders/camera-feed-decoders.md) — Captures live camera video and decodes QR codes and barcodes in real time using browser media APIs. ([source](https://qrcode.minhazav.dev))
- [Barcode Detection Accuracy Enhancements](https://awesome-repositories.com/f/artificial-intelligence-ml/audio-transcription/transcription-apis/contextual-accuracy-improvements/barcode-detection-accuracy-enhancements.md) — Enhances the core scanning algorithms to reliably detect codes that currently fail or produce errors. ([source](https://github.com/mebjas/html5-qrcode/wiki/Feature-request-sponsorship-goals))

### Data & Databases

- [Scan Result Callbacks](https://awesome-repositories.com/f/data-databases/real-time-data-streaming/scan-result-callbacks/scan-result-callbacks.md) — Ships callback-driven result handling for successful code detection and scan or video failures. ([source](https://qrcode.minhazav.dev/HTML5-QR-Code-scanning-support-for-local-file-and-default-camera/))

### Development Tools & Productivity

- [JavaScript](https://awesome-repositories.com/f/development-tools-productivity/barcode-scanners/javascript.md) — Reads 1D and 2D barcodes from camera video or image files using JavaScript without server uploads.
- [Automatic Scan Terminations](https://awesome-repositories.com/f/development-tools-productivity/scan-configurations/workflow-scanning/automatic-scan-terminations.md) — Automatically stops the camera and scanning after a successful code read to prevent redundant processing.
- [Automatic Scan Termination](https://awesome-repositories.com/f/development-tools-productivity/barcode-scanners/scan-input-configuration/automatic-scan-termination.md) — Automatically stops the camera and scanning process after a successful code read to prevent redundant scans. ([source](https://qrcode.minhazav.dev/HTML5-QR-Code-scanning-support-for-local-file-and-default-camera/))
- [Scanning Configurations](https://awesome-repositories.com/f/development-tools-productivity/barcode-scanners/scanning-configurations.md) — Provides runtime configuration for scanning speed, region, code formats, and camera controls.
- [Scan Scope Restrictions](https://awesome-repositories.com/f/development-tools-productivity/configuration-search-paths/scan-scope-restrictions.md) — Limits the scanner to decode only a user-defined subset of QR or barcode formats. ([source](https://qrcode.minhazav.dev/about/))
- [Scan Session Termination](https://awesome-repositories.com/f/development-tools-productivity/programmatic-scanning-apis/scan-session-termination.md) — Provides programmatic control to stop scanning sessions and release camera resources on demand. ([source](https://qrcode.minhazav.dev/about/))
- [Runtime Scanning Configurations](https://awesome-repositories.com/f/development-tools-productivity/scan-configurations/runtime-scanning-configurations.md) — Provides a runtime configuration object to adjust scanning speed, region, aspect ratio, and supported code formats.

### Graphics & Multimedia

- [Client-Side Barcode Decodings](https://awesome-repositories.com/f/graphics-multimedia/image-decoding/client-side-barcode-decodings.md) — Decodes QR codes and barcodes from user-selected image files entirely on the client side using JavaScript.
- [Multi-Format Barcode Recognitions](https://awesome-repositories.com/f/graphics-multimedia/video-converters/multi-format-exporters/barcode-format-export/multi-format-barcode-recognitions.md) — Decodes a configurable subset of 1D and 2D barcode formats using a unified scanning algorithm.
- [Inline Camera Switchings](https://awesome-repositories.com/f/graphics-multimedia/camera-systems/camera-enumerators/camera-availability-watchers/inline-camera-switchings.md) — Switches between available cameras inline without stopping the current scan session.

### Mobile Development

- [QR Code Scanner Libraries](https://awesome-repositories.com/f/mobile-development/camera-libraries/qr-code-scanner-libraries.md) — Captures device camera video and decodes QR codes in real time with configurable scanning behavior.
- [Browser-Based Camera Scannings](https://awesome-repositories.com/f/mobile-development/mobile-capabilities/camera-integration/camera-feed-capture/browser-based-camera-scannings.md) — Captures live camera video and decodes QR codes and barcodes in real time within the browser.
- [Automatic Scan Termination](https://awesome-repositories.com/f/mobile-development/distribution-updates/over-the-air-updates/success-verifications/automatic-scan-termination.md) — Automatically stops the camera and scanning process after a successful code read to prevent redundant scans. ([source](https://qrcode.minhazav.dev))

### Software Engineering & Architecture

- [Callback-Driven Request Handling](https://awesome-repositories.com/f/software-engineering-architecture/callback-driven-request-handling.md) — Invokes user-defined callbacks for successful code detection, scan failures, and video stream errors.
- [Scan Success and Failure Callbacks](https://awesome-repositories.com/f/software-engineering-architecture/failure-handling-policies/success-and-failure-wrapping/scan-success-and-failure-callbacks.md) — Invokes user-defined callbacks when a code is successfully decoded or when scanning fails. ([source](https://qrcode.minhazav.dev/about/))
- [Scanner Behavior Configurations](https://awesome-repositories.com/f/software-engineering-architecture/default-configuration-values/mock-default-behavior-configurations/behavioral-configuration/scanner-behavior-configurations.md) — Adjusts scanning speed, viewfinder region, aspect ratio, mirror handling, and supported code formats via a configuration object. ([source](https://qrcode.minhazav.dev))

### DevOps & Infrastructure

- [Failure Event Handling](https://awesome-repositories.com/f/devops-infrastructure/automation-orchestration/task-execution-frameworks/task-job-management/task-schedulers/failure-event-handling.md) — Invokes a user-defined function when no code is detected or when the camera fails to start. ([source](https://qrcode.minhazav.dev/))
- [Scan Failure Callbacks](https://awesome-repositories.com/f/devops-infrastructure/automation-orchestration/task-execution-frameworks/task-job-management/task-schedulers/failure-event-handling/scan-failure-callbacks.md) — Invokes a user-defined callback when the scanner fails to read a code or encounters a video stream error. ([source](https://qrcode.minhazav.dev))

### User Interface & Experience

- [Scanner Performance and Region Configurations](https://awesome-repositories.com/f/user-interface-experience/presentation-frameworks/slide-management-configuration/slide-aspect-ratio-configurators/scanner-performance-and-region-configurations.md) — Adjusts frames per second, scanning region, aspect ratio, and flip behavior to balance scanning speed and accuracy. ([source](https://qrcode.minhazav.dev/about/))
- [Camera Flash and Zoom Controls During Scanning](https://awesome-repositories.com/f/user-interface-experience/viewport-navigation-controls/zoom-animations/zoom-control-panels/camera-flash-and-zoom-controls-during-scanning.md) — Toggles the device torch and adjusts camera zoom while scanning to improve readability in low light or for distant codes. ([source](https://cdn.jsdelivr.net/gh/mebjas/html5-qrcode@master/README.md))
- [Camera Torch and Zoom Controls](https://awesome-repositories.com/f/user-interface-experience/viewport-navigation-controls/zoom-animations/zoom-control-panels/camera-torch-and-zoom-controls.md) — Controls device torch and camera zoom during scanning to improve readability in low light or for distant codes.

### Web Development

- [Barcode Format Filters](https://awesome-repositories.com/f/web-development/code-formatting/barcode-format-filters.md) — Ships configurable format filtering to restrict scanning to specific 1D and 2D code types. ([source](https://cdn.jsdelivr.net/gh/mebjas/html5-qrcode@master/README.md))
- [Barcode Format Restrictions](https://awesome-repositories.com/f/web-development/code-formatting/barcode-format-restrictions.md) — Restricts the scanner to recognize only a user-defined subset of QR or barcode formats. ([source](https://qrcode.minhazav.dev/))