# jscanify: The Javascript Document Scanning Library

This repository profile is provided by osrepos.com, an open source repository discovery platform.

Source: osrepos.com
Repository profile: https://osrepos.com/repo/puffinsoft-jscanify
Generated for open source discovery and AI-assisted research.

jscanify is a powerful Javascript library designed for document scanning, offering features such as paper detection, distortion correction, glare suppression, and multi-colored paper support. Built with `opencv.js`, it provides robust capabilities for web, NodeJS, and React environments, making it a versatile tool for various applications.

GitHub: https://github.com/puffinsoft/jscanify
OSRepos URL: https://osrepos.com/repo/puffinsoft-jscanify

## Summary

jscanify is a powerful Javascript library designed for document scanning, offering features such as paper detection, distortion correction, glare suppression, and multi-colored paper support. Built with `opencv.js`, it provides robust capabilities for web, NodeJS, and React environments, making it a versatile tool for various applications.

## Topics

- javascript
- document-scanner
- nodejs
- image-processing
- computer-vision
- web-development
- js

## Repository Information

Last analyzed by OSRepos: Sun Oct 12 2025 04:50:45 GMT+0100 (Western European Summer Time)
Detail views: 6
GitHub clicks: 4

## Safety Notice

OSRepos shares public repositories for knowledge and discovery only. Review source code, dependencies, licenses, and security implications before running or installing anything.

## Content

## Introduction

jscanify is a robust Javascript library developed by puffinsoft, designed for efficient document scanning directly within web and Node.js environments. Leveraging the power of `opencv.js`, it provides advanced features for detecting, correcting, and extracting documents from images or live camera feeds. With **1649 stars** and **74 forks** on GitHub, it's a well-regarded tool in the developer community.

Key features include:
*   Paper detection and highlighting
*   Distortion correction for scanned documents
*   New in v1.3.0+: Glare suppression
*   New in v1.3.0+: Multi-colored paper support

Whether you're building a web application that needs to process user-uploaded documents or a backend service for image analysis, jscanify offers a comprehensive solution.

## Installation

jscanify is easy to integrate into your project. You can install it via npm or include it directly via CDN.

**npm:**

bash
npm i jscanify


Then, import it into your Javascript code:

javascript
import jscanify from 'jscanify'


**CDN:**

For browser-based applications, include the following script tags. Note that `opencv.js` should be loaded asynchronously.

html
<script src="https://docs.opencv.org/4.7.0/opencv.js" async></script>
<!-- warning: loading OpenCV can take some time. Load asynchronously -->
<script src="https://cdn.jsdelivr.net/gh/ColonelParrot/jscanify@master/src/jscanify.min.js"></script>


**Note:** jscanify on NodeJS has slight differences. Refer to the [official documentation](https://github.com/ColonelParrot/jscanify/wiki#use-on-nodejs) for specific instructions.

## Examples

jscanify provides straightforward APIs for common document scanning tasks.

### Highlight Paper in Image

This example demonstrates how to highlight detected paper within an existing image.

html
<img src="/path/to/your/image.png" id="image" />


javascript
const scanner = new jscanify();
image.onload = function () {
  const highlightedCanvas = scanner.highlightPaper(image);
  document.body.appendChild(highlightedCanvas);
};


### Extract Paper

To extract the detected paper as a separate, corrected image:

javascript
const scanner = new jscanify();
const paperWidth = 500;
const paperHeight = 1000;
image.onload = function () {
  const resultCanvas = scanner.extractPaper(image, paperWidth, paperHeight);
  document.body.appendChild(resultCanvas);
};


### Highlighting Paper in User Camera

jscanify can also process live video streams from a user's camera, continuously highlighting paper in real-time.

html
<video id="video"></video> <canvas id="canvas"></canvas>
<!-- original video -->
<canvas id="result"></canvas>
<!-- highlighted video -->


javascript
const scanner = new jscanify();
const canvasCtx = canvas.getContext("2d");
const resultCtx = result.getContext("2d");
navigator.mediaDevices.getUserMedia({ video: true }).then((stream) => {
  video.srcObject = stream;
  video.onloadedmetadata = () => {
    video.play();

    setInterval(() => {
      canvasCtx.drawImage(video, 0, 0);
      const resultCanvas = scanner.highlightPaper(canvas);
      resultCtx.drawImage(resultCanvas, 0, 0);
    }, 10);
  };
});


You can also use the [jscanify debugging tool](https://colonelparrot.github.io/jscanify/tester.html) to test and observe results on various images.

## Why Use jscanify?

jscanify stands out as a powerful and flexible solution for document scanning in Javascript. Its key advantages include:

*   **Robust Detection:** Reliably identifies and highlights paper in diverse conditions, even with multi-colored backgrounds.
*   **Advanced Correction:** Automatically corrects distortion, providing clean and usable scanned outputs.
*   **Real-time Processing:** Capable of processing live camera feeds for interactive scanning experiences.
*   **Cross-Platform Support:** Works seamlessly across web browsers and Node.js environments.
*   **Active Development:** Continuously improved with new features like glare suppression, ensuring cutting-edge performance.

It simplifies complex image processing tasks, allowing developers to integrate sophisticated document scanning functionalities with minimal effort.

## Links

*   **GitHub Repository:** [puffinsoft/jscanify](https://github.com/puffinsoft/jscanify)
*   **Official Documentation (Wiki):** [jscanify Wiki](https://github.com/puffinsoft/jscanify/wiki)
*   **npm Package:** [jscanify on npm](https://www.npmjs.com/package/jscanify)
*   **jsdelivr CDN:** [jscanify on jsdelivr](https://www.jsdelivr.com/package/gh/ColonelParrot/jscanify)
*   **jscanify Debugging Tool:** [Tester Page](https://colonelparrot.github.io/jscanify/tester.html)