Guide · Open source
How to use qrcodejs: generate QR codes in the browser
Updated · written with AI from the project's own documentation and checked against our catalogue data
qrcodejs (davidshimjs/qrcodejs) is a JavaScript library that generates QR codes inside a web page for a piece of text or a link. It is aimed at web developers who want to show a QR code on a page without adding extra dependencies. After this guide you will know how to place a QR code in a container element, pass options such as size and colours, and change the code with the clear and makeCode methods.
Quick start
- 1Get the files. Clone the repository with git clone https://github.com/davidshimjs/qrcodejs.
- 2Add a container. Place an empty div with an id in your HTML page where the code should appear.
- 3Create the code. Call new QRCode with the element and your text or URL.
- 4Add options. Pass an object with width, height, colours and correctLevel to adjust the output.
- 5Update the code. Use makeCode() to draw a new code or clear() to remove the current one.
What qrcodejs does and who it is for
QRCode.js is a library for making QR codes. You give it some text or a link and a container element, and it draws the code using HTML5 Canvas or a table tag in the DOM. The README states that it has no dependencies and supports cross-browser use, including old Internet Explorer versions (IE6 to 10 are listed).
It suits web developers who want to show a QR code for a URL on a page, developers maintaining sites that must support older browsers, and projects that want to avoid extra libraries. It is not a ready-made QR tool for people who do not write code, and the README only describes browser usage, so it is not documented as a server-side or command-line generator.
Get the qrcodejs files
The README gives a clone command for the repository. The source lists no prerequisites and does not describe a package-manager install, so the clone command is the install method it documents.
git clone https://github.com/davidshimjs/qrcodejsCreate a QR code with the basic usage
Add an empty container element to your page, then call new QRCode with that element and the text to encode. The README example passes the element and a URL directly.
<div id="qrcode"></div>
<script type="text/javascript">
new QRCode(document.getElementById("qrcode"), "http://jindo.dev.naver.com/collie");
</script>Set options: size, colours and error correction
Pass an object instead of a bare string to control the output. The README example sets text, width, height, colorDark, colorLight and correctLevel. It uses QRCode.CorrectLevel.H for the correction level.
- text: the content to encode
- width and height: size of the code (the example uses 128)
- colorDark and colorLight: foreground and background colours (example values #000000 and #ffffff)
- correctLevel: set with QRCode.CorrectLevel.H in the example
<div id="qrcode"></div>
<script type="text/javascript">
var qrcode = new QRCode(document.getElementById("qrcode"), {
text: "http://jindo.dev.naver.com/collie",
width: 128,
height: 128,
colorDark : "#000000",
colorLight : "#ffffff",
correctLevel : QRCode.CorrectLevel.H
});
</script>Change or clear the code
Keep the object returned by new QRCode to call its methods. clear() removes the current code and makeCode() draws a new one from the text you pass.
qrcode.clear(); // clear the code.
qrcode.makeCode("http://naver.com"); // make another code.What people use it for
- Showing a QR code for a URL on a web page
- Adding a scannable link to a site that must support older browsers
- Building a page component without adding extra JavaScript libraries
Frequently asked questions
Is qrcodejs free to use?
Yes. The README lists the licence as MIT. Check the LICENSE file in the repository for the full terms.
Does qrcodejs need any other libraries?
No. The README states that QRCode.js has no dependencies. Its prerequisites are not listed.
Can qrcodejs run on a server or from the command line?
The README only describes browser usage, so it does not document server-side or command-line generation. Use a tool such as node-qrcode or qrcode if you need that.
Which browsers does qrcodejs support?
The README lists IE6 to 10, Chrome, Firefox, Safari, Opera, Mobile Safari, Android and Windows Mobile. It draws codes with HTML5 Canvas or a table tag in the DOM.
Is qrcodejs still maintained?
The README gives no recent version, and the last push shown in our analysis is from May 2024. If you need actively maintained support, consider comparable projects such as qrcode or node-qrcode.
What are the alternatives to qrcodejs?
Comparable projects include qrcode, node-qrcode and qr.js. Choose based on whether you need browser-only code, Node.js support or active maintenance.
New agent skills, repos and AI tools — every week
The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.
Our verdict
qrcodejs suits web developers who want a dependency-free way to show a QR code on a page, especially on sites that must support old browsers. It is not a good fit for people who want a no-code tool, for server-side or command-line generation, or for teams that need recent, actively maintained support.
Install options & downloads