How to Make QR Code Generator using HTML CSS and JS (JavaScript)?

In this course you will learn how to make your own QR Code Generator Website using HTML, CSS and JS (JavaScript). With Favorite color, size and add your logo. You can use the below QR Code Generator to make QR Code images with any color, any size, with your own logo and finally download it.

There is also a video course for this article on my YouTube Channel that you can watch here. The source code is below the demo. Scroll down ↓ .

QR Code Generator Website

Customize Your QR Code

Enter Your Text

Background Color

Text Color

QR Code Width and Height

Your Logo

Logo Width and Height

Logo Transparent:

If Checked, the logo background color will not have any effect.

Logo Background

Download the necessary files:

easy.qrcode.js (The related JavaScript Library).

test-qr-code.png

Click on the following buttons, then click on the code and Select All the content [CTRL + A], Copy [CTRL + C], Create a new file and Paste [CTRL +V] in the corresponding file (index.html or script.js). If something is not clear or if there is any issue, watch the video here.

index.html

script.js