<!DOCTYPE html>
< html >
< head >
< meta name = "viewport" content = "width=device-width, initial-scale=1" >
< title > Tesseract.js | Pure Javascript OCR for 100 Languages!< / title >
< link rel = "stylesheet" type = "text/css" href = "css/main.css" >
< link href = 'https://fonts.googleapis.com/css?family=Lato:300,400' rel = 'stylesheet' type = 'text/css' >
< script >
if (location.protocol === "http:" & & !location.host.startsWith('localhost')) {
location.replace("https" + window.location.href.slice(4));
}
< / script >
< / head >
< body ondragover = "return false" >
< div id = "splash" >
< div id = "logo-wrap" class = "header" >
< canvas id = "logo-canvas" > < / canvas >
< img id = "logo-img" src = "img/logowhite.png" >
< div id = 'slogan' > Pure Javascript Multilingual OCR< / div >
< / div >
< div class = 'get-started-wrap' >
< a href = "https://github.com/naptha/tesseract.js#tesseractjs" >
< div class = 'get-started' >
< svg id = "github" viewBox = "0 0 16 16" aria-hidden = "true" > < path d = "M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0 0 16 8c0-4.42-3.58-8-8-8z" > < / path > < / svg >
Get Started
< / div >
< / a >
< / div >
< / div >
< div id = 'demo' >
<!-- <div class="commentary">
< div id = 'demo-title' > Demo< / div >
< p > Wherein we show you that Tesseract.js works, and let you try it with your own images.< / p >
< / div >
-->
< div class = 'commentary' >
< p > < b > Tesseract.js< / b > is a pure Javascript port of the popular < a href = 'https://github.com/tesseract-ocr/tesseract' > Tesseract OCR engine< / a > . < / p >
< p > This library supports < b > more than 100 languages< / b > , automatic text < b > orientation and script detection< / b > , a simple interface for reading paragraph, word, and character < b > bounding boxes< / b > . Tesseract.js can run either in a < b > browser< / b > and on a server with < b > NodeJS< / b > . < / p >
< p > Check out the < a href = 'https://github.com/naptha/tesseract.js#tesseractjs' > Example code and API docs on GitHub< / a > .< / p >
< / div >
< div id = 'demo-body' >
< div id = 'options' >
< div class = "option selected" lang = 'eng' > English Demo< / div >
< div class = "option" lang = 'chi_sim' > Chinese Demo< / div >
< div class = "option" lang = 'rus' > Russian Demo< / div >
< / div >
< div id = 'drop-instructions-main' > < p > Drop < span class = 'drop-instructions' > an English< / span > image on this page to OCR it!< / p > < / div >
< div id = 'demo-content' >
< div >
< canvas id = 'input-overlay' > < / canvas >
< img id = 'input' src = "img/eng_bw.png" / >
< / div >
< div id = 'arrow' > < / div >
< div >
<!-- <div id='output - overlay'></div> -->
<!-- <textarea id='output - text'></textarea> -->
< div id = 'log' > < / div >
< div id = 'demo-instructions' >
< span id = 'clickme' onclick = 'play()' > Click here to recognize text in the demo image< / span > , or drop < span class = 'drop-instructions' > an English< / span > image anywhere on this page.
< / div >
<!-- <canvas id='output'></canvas> -->
< / div >
< / div >
< div class = 'get-started-wrap' >
< br / >
< a href = "https://github.com/naptha/tesseract.js#tesseractjs" >
< div class = 'get-started' >
< svg id = "github" viewBox = "0 0 16 16" aria-hidden = "true" > < path d = "M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0 0 16 8c0-4.42-3.58-8-8-8z" > < / path > < / svg >
Actually Get Started
< / div >
< / a >
< / div >
< / div >
< / div >
< div id = 'footer' >
< span id = "lengle" > “Speaking of ways, pet, by the way, < b > there < i > is< / i > such a thing as a tesseract< / b > .”
< br >
< br >
<!-- Made with <img src="img/keyboard.png"> --> By < a href = "https://twitter.com/biject" > @biject< / a > , < a href = "https://twitter.com/antimatter15" > @antimatter15< / a > and < a href = "https://github.com/jeromewu" > @jeromewu< / a > < / span >
< / div >
< script src = "animation/raf.js" > < / script >
< script src = "animation/mouse.js" > < / script >
< script src = "animation/dimensions.js" > < / script >
< script src = "animation/hypercube.js" > < / script >
< script src = "animation/animate.js" > < / script >
< script src = "https://unpkg.com/tesseract.js@2.0.0/dist/tesseract.min.js" integrity = "sha384-MTEb82ufpBJ2VCTmPZlD/+vgiT5z6zmOwqU/uDO9IobYm9xCOUEN0WH3czf6ppl8" crossorigin = "anonymous" > < / script >
< script src = "demo.js" > < / script >
< script >
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-83153710-3', 'auto', 'origin');
ga('origin.send', 'pageview');
ga('create', 'UA-139963961-1', 'auto', 'addon');
ga('addon.send', 'pageview');
< / script >
< / body >
< / html >
