QR-Code-Generator/index.html at main · naman9104/QR-Code-Generator · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
  <title>Custom QR Code Generator</title>
  <link rel="stylesheet" href="style.css" />
  <meta name="description" content="Generate customizable QR codes online. Fast, free and downloadable.">
  <meta name="keywords" content="QR code generator, qr download, custom qr, fast qr code">
  <meta name="author" content="Naman Sachdeva">

  <!-- Open Graph for social share -->
  <meta property="og:title" content="QR Code Generator by Naman" />
  <meta property="og:description" content="Free tool to generate customizable QR codes with live preview." />
  <meta property="og:image" content="https://naman9104.github.io/qr-code-generator/preview.png" />
  <meta property="og:url" content="https://naman9104.github.io/qr-code-generator/" />
</head>
<body>
  <div class="container">
    <h1>QR Code Generator</h1>

    <input type="text" id="text" placeholder="Enter URL or text" />

    <div class="options">
      <label>Size: <input type="number" id="size" value="200" /></label>
      <label>Foreground: <input type="color" id="fgColor" value="#000000" /></label>
      <label>Background: <input type="color" id="bgColor" value="#ffffff" /></label>
    </div>

   <div class="preview-box">
  <h2>QR Code Preview</h2>
  <div id="qrcode"></div>
</div>


    <button id="downloadBtn">Download QR</button>

    <div class="ads">
  <a href="https://www.amazon.in/Transparent-Triple-Mode-Connectivity-Compatible-Android-Grey/dp/B0FCFW7QB5?content-id=amzn1.sym.0629fcb0-94ed-4eba-9abe-6c93c227c465%3Aamzn1.sym.0629fcb0-94ed-4eba-9abe-6c93c227c465&crid=247HIQNOG5UVS&cv_ct_cx=mouse%2Bfor%2Bpc&keywords=mouse%2Bfor%2Bpc&pd_rd_i=B0FCFW7QB5&pd_rd_r=1ff95549-acbf-45ee-a8b1-84dd5c1eeb90&pd_rd_w=qyqgF&pd_rd_wg=LFn51&pf_rd_p=0629fcb0-94ed-4eba-9abe-6c93c227c465&pf_rd_r=DFWHPXPVKJNM629EV7X5&qid=1764005102&s=electronics&sbo=RZvfv%2F%2FHxDF%2BO5021pAnSA%3D%3D&sprefix=mouse%2B%2Celectronics%2C428&sr=1-3-66673dcf-083f-43ba-b782-d4a436cc5cfb-spons&aref=snHx8ELHRG&sp_csd=d2lkZ2V0TmFtZT1zcF9zZWFyY2hfdGhlbWF0aWM&th=1&linkCode=ll1&tag=money0834-21&linkId=f92c718939d9f1ca316e05b02eac1534&language=en_IN&ref_=as_li_ss_tl" target="_blank" style="
    display:inline-block;
    padding:10px 20px;
    background:#ff9900;
    color:#000;
    border-radius:8px;
    text-decoration:none;
    font-weight:600;">
    👉 Check Amazon Deal
  </a>
</div>

  </div>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/qrcodejs/1.0.0/qrcode.min.js"></script>
  <script src="script.js"></script>
</body>
</html>