Paste OCR Chrome Extension

Manifest V3 Chrome extension that toggles a floating OCR overlay on the current page and runs OCR locally with tesseract.js and WebAssembly.

What it does

• Opens as a floating overlay in the upper-right area of the current webpage
• Accepts image paste, drag-and-drop, or file selection
• Runs OCR with local worker, wasm core, and packaged English traineddata variants
• Includes minimize and size controls plus visible lower-left and lower-right resize handles
• Includes English-focused preprocessing controls and a processed preview
• Lets you copy recognized text back to the clipboard

Install

npm install
npm run build

Then load the built extension in Chrome:

1. Open chrome://extensions
2. Enable Developer mode
3. Click Load unpacked
4. Select the dist folder

Use it

1. Open any normal webpage
2. Click the extension action button
3. Paste an image, drop one into the overlay, or choose a file
4. Wait for OCR to finish and copy the extracted text

Notes:

• The overlay closes with the Close button or Escape
• Escape minimizes first, then closes on a second press
• The default model is the packaged English 4.0.0_best_int variant for better accuracy
• The panel body scrolls vertically when the controls or output exceed the visible height
• Chrome system pages such as chrome://extensions do not allow content scripts, so the overlay will not open there

Development notes

• Source lives in src
• background.js toggles the on-page overlay
• content.jsx mounts the OCR UI in a shadow DOM overlay
• The build script bundles the background and content scripts and copies the Tesseract worker, core wasm files, and both packaged English data variants into dist/vendor
• OCR is pinned to tesseract.js 7.0.0, tesseract.js-core 7.0.0, and @tesseract.js-data/eng 1.0.0

Extend languages

To add another language, install the matching @tesseract.js-data/<lang> package, copy its traineddata in build.mjs, and update createWorker(...) in src/popup.js.