Skip to content

Commit

Permalink
files added
Browse files Browse the repository at this point in the history 
all files added
  • Loading branch information
@bantikumarsatlokashram
bantikumarsatlokashram authored Jun 25, 2024
1 parent 5d5aca8 commit d654204
Show file tree
Hide file tree
Showing 4 changed files with 673 additions and 0 deletions.
243 changes: 243 additions & 0 deletions index.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,243 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>FREE QR Code Generator - BKPK VIDEO</title>
<meta name="description" content="Create your own QR Codes with our Free Online QR Code Generator. Enjoy features like Dynamic Codes, Tracking, Analytics, Free text, vCards, and more." />
<link rel="canonical" href="https://www.bkpkvideo.com/tools/free-qrcode-genrator" />
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="next" href="https://www.bkpkvideo.com/page/2/" />
<meta property="og:locale" content="en_US" />
<meta property="og:type" content="website" />
<meta property="og:title" content="BKPK VIDEO &raquo; Create your own QR Codes with our Free Online QR Code Generator. Enjoy features like Dynamic Codes, Tracking, Analytics, Free text, vCards, and more." />
<meta property="og:description" content="Create your own QR Codes with our Free Online QR Code Generator. Enjoy features like Dynamic Codes, Tracking, Analytics, Free text, vCards, and more." />
<meta property="og:url" content="https://www.bkpkvideo.com/tools/free-qrcode-genrator" />
<meta property="og:site_name" content="BKPK VIDEO" />
<meta property="og:image" content="https://www.bkpkvideo.com/wp-content/uploads/2024/06/QR-CODE.png" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:site" content="@BKPKVIDEO" />
<meta name="google-site-verification" content="googlebd28a36d7e7297aa" />
<meta name="yandex-verification" content="30bdf7179f639924" />
<meta name="robots" content="index, max-image-preview:large" />
<meta property="fb:app_id" content="730845160831987" />
<meta property="facebook-domain-verification" content="bwfynb8ox1kb2y7vhq1iydkp0bnb52" />
<link rel="icon" href="https://www.bkpkvideo.com/wp-content/uploads/2022/01/cropped-BKPKVIDEO-app-icon-32x32.png" sizes="32x32" />
<link rel="icon" href="https://www.bkpkvideo.com/wp-content/uploads/2022/01/cropped-BKPKVIDEO-app-icon-192x192.png" sizes="192x192" />
<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@simonwep/pickr/dist/themes/classic.min.css"/>
<link rel="stylesheet" href="styles.css">
<script type="application/ld+json">{
"@context": "https://schema.org/",
"@type": "CreativeWorkSeries",
"name": "100% FREE QR Code Genrator",
"aggregateRating": {
"@type": "AggregateRating",
"ratingValue": "4.9",
"bestRating": "5",
"ratingCount": "709456"
}
}</script>
</head>
<body class="bg-gray-100 text-gray-900">
<header>
<div class="container mx-auto">
<div class="logo">
<img src="logo.svg" alt="Logo">
</div>
<nav>
<ul>
<li><a href="https://www.bkpkvideo.com/tools/OnlineNotepad/" target="_blank">Online Notepad</a></li>
<li><a href="https://www.bkpkvideo.com/tools/ImageCompressor/" target="_blank">Image Compressor</a></li>
<li>
<a href="#">Other Tools</a>
<ul>
<li><a href="https://www.bkpkvideo.com/tools/youtube-tag-generator/" target="_blank">Youtube Tag Generator</a></li>
<li><a href="https://bkpkvideo.com/tools/YouTube-Thumbnail-Downloader/" target="_blank">Youtube Thumbnail Downloader</a></li>
<li><a href="https://www.bkpkvideo.com/replace-new-line-into-comma/" target="_blank">Replace new lines with commas</a></li>
<li><a href="https://www.bkpkvideo.com/tools/converter/srt/srt-to-txt-converter.html" target="_blank">SRT to DOCX</a></li>
</ul>
</li>
</ul>
</nav>
</div>
</header>
<div class="container mx-auto mt-5 px-4">
<div class="bg-white shadow-md rounded p-6 flex flex-wrap">
<div class="w-full md:w-1/2 pr-4">
<h2 class="text-2xl mb-4">100% FREE QR Code Generator</h2>
<form id="qrForm" class="space-y-4">
<div class="form-group">
<label for="qrText" class="block text-gray-700">Type Your Link, short message here:</label>
<textarea class="w-full p-2 border border-gray-300 rounded" id="qrText" rows="4" placeholder="Type your text here..."></textarea>
</div>
<div class="form-group">
<label for="qrColor" class="block text-gray-700 gradient-text">Choose QR Code Color and transparency</label>
<input type="text" id="qrColor" class="w-full p-2 border border-gray-300 rounded" value="#000000" />
</div>
<div class="form-group animated-dropdown">
<label for="qrSize" class="block text-gray-700">Choose QR Code size in Pixel</label>
<select id="qrSize" class="w-full p-2 border border-gray-300 rounded">
<option value="1000">1000x1000px</option>
<option value="2000">2000x2000px</option>
<option value="3000">3000x3000px</option>
<option value="4000">4000x4000px</option>
<option value="5000">5000x5000px</option>
<option value="6000">6000x6000px</option>
<option value="7000">7000x7000px</option>
<option value="8000">8000x8000px</option>
<option value="9000">9000x9000px</option>
<option value="10000">10000x10000px</option>
<option value="11000">11000x11000px</option>
<option value="12000">12000x12000px</option>
<option value="13000">13000x13000px</option>
<option value="14000">14000x14000px</option>
<option value="15000">15000x15000px</option>
<option value="16000">16000x16000px</option>
</select>
</div>
<button type="submit" class="bg-purple-600 text-white px-4 py-2 rounded w-full hover:bg-purple-700 transition duration-300"><i class="fas fa-qrcode"></i> Generate QR Code</button>
</form>
</div>
<div class="w-full md:w-1/2 pl-4 text-center mt-4 md:mt-0">
<h2 class="another">Generated QR Code</h2>
<div id="qrCode" class="qr-code mb-4"></div>
<div id="saveButtonWrapper" class="save-as-buttons" style="display: none;">
<strong class="h2.text-2xl.mb-4">Save QR Code in:</strong>
<button id="downloadJPG" class="bg-green-500 text-white px-4 py-2 rounded hover:bg-green-600 transition duration-300"><i class="fas fa-save"></i> JPG</button>
<button id="downloadPNG" class="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600 transition duration-300"><i class="fas fa-save"></i> PNG</button>
<button id="downloadWebP" class="bg-red-500 text-white px-4 py-2 rounded hover:bg-red-600 transition duration-300"><i class="fas fa-save"></i> WebP</button>
</div>
</div>
</div>
</div>

<div class="container mx-auto mt-5 px-4">
<h2 class="text-2xl mb-4">Frequently Asked Questions</h2>
<div class="accordion">
<div class="accordion-item">
<button id="accordion-button-1" aria-expanded="false">
<span class="accordion-title">1. What is a QR Code Generator?</span>
<span class="icon" aria-hidden="true"></span>
</button>
<div class="accordion-content">
<p>A QR Code Generator is a tool that creates QR (Quick Response) codes, which are two-dimensional barcodes that can store data such as URLs, text, contact information, and more. This generator allows you to customize the color, size, and format of your QR codes.</p>
</div>
</div>
<div class="accordion-item">
<button id="accordion-button-2" aria-expanded="false">
<span class="accordion-title">2. How do I use the QR Code Generator?</span>
<span class="icon" aria-hidden="true"></span>
</button>
<div class="accordion-content">
<p>To use the QR Code Generator, enter the text or URL you want to encode in the provided input box, select the desired color and size, and click "Generate QR Code." The generated QR code will be displayed on the screen, and you can save it in different formats.</p>
</div>
</div>
<div class="accordion-item">
<button id="accordion-button-3" aria-expanded="false">
<span class="accordion-title">3. Can I customize the color of the QR code?</span>
<span class="icon" aria-hidden="true"></span>
</button>
<div class="accordion-content">
<p>Yes, you can customize the color of the QR code using our tool. Simply select your preferred color using the color picker provided in the "Choose QR Code Color" section.</p>
</div>
</div>
<div class="accordion-item">
<button id="accordion-button-4" aria-expanded="false">
<span class="accordion-title">4. What sizes can I generate QR codes in?</span>
<span class="icon" aria-hidden="true"></span>
</button>
<div class="accordion-content">
<p>Our QR Code Generator allows you to generate QR codes in various sizes, ranging from 1000x1000 pixels to 16000x16000 pixels. Select the desired size from the dropdown menu before generating your QR code.</p>
</div>
</div>
<div class="accordion-item">
<button id="accordion-button-5" aria-expanded="false">
<span class="accordion-title">5. What formats can I save the QR code in?</span>
<span class="icon" aria-hidden="true"></span>
</button>
<div class="accordion-content">
<p>You can save the generated QR code in three formats: JPG, PNG, and WebP. Each format offers different benefits, such as transparency for PNG and smaller file sizes for WebP.</p>
</div>
</div>
<div class="accordion-item">
<button id="accordion-button-6" aria-expanded="false">
<span class="accordion-title">6. How can I download the generated QR code?</span>
<span class="icon" aria-hidden="true"></span>
</button>
<div class="accordion-content">
<p>After generating the QR code, click on the respective button (JPG, PNG, or WebP) under the "Save as" section. The QR code will be saved in your chosen format.</p>
</div>
</div>
<div class="accordion-item">
<button id="accordion-button-7" aria-expanded="false">
<span class="accordion-title">7. Is the QR Code Generator free to use?</span>
<span class="icon" aria-hidden="true"></span>
</button>
<div class="accordion-content">
<p>Yes, our QR Code Generator is completely free to use. You can create and download as many QR codes as you need without any cost.</p>
</div>
</div>
<div class="accordion-item">
<button id="accordion-button-8" aria-expanded="false">
<span class="accordion-title">8. Do I need to register to use the QR Code Generator?</span>
<span class="icon" aria-hidden="true"></span>
</button>
<div class="accordion-content">
<p>No, you do not need to register or create an account to use our QR Code Generator. It is available for everyone to use without any registration.</p>
</div>
</div>
<div class="accordion-item">
<button id="accordion-button-9" aria-expanded="false">
<span class="accordion-title">9. Can I use the QR codes generated for commercial purposes?</span>
<span class="icon" aria-hidden="true"></span>
</button>
<div class="accordion-content">
<p>Yes, you can use the QR codes generated by our tool for both personal and commercial purposes without any restrictions.</p>
</div>
</div>
<div class="accordion-item">
<button id="accordion-button-10" aria-expanded="false">
<span class="accordion-title">10. Is there a limit to the number of QR codes I can generate?</span>
<span class="icon" aria-hidden="true"></span>
</button>
<div class="accordion-content">
<p>No, there is no limit to the number of QR codes you can generate using our tool. You can create as many QR codes as you need.</p>
</div>
</div>
</div>
</div>

<footer class="bg-purple-600 text-white text-center py-4 mt-5">
<div class="container mx-auto">
<p>&copy; BKPKVIDEO 2024. All Rights Reserved.</p>
</div>
</footer>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/spectrum/1.8.1/spectrum.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/2.0.5/FileSaver.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@simonwep/pickr/dist/pickr.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/qrcodejs/1.0.0/qrcode.min.js"></script>
<script>
const items = document.querySelectorAll(".accordion button");

function toggleAccordion() {
const itemToggle = this.getAttribute('aria-expanded');

for (i = 0; i < items.length; i++) {
items[i].setAttribute('aria-expanded', 'false');
}

if (itemToggle == 'false') {
this.setAttribute('aria-expanded', 'true');
}
}

items.forEach(item => item.addEventListener('click', toggleAccordion));
</script>
<script src="scripts.js"></script>
</body>
</html>
47 changes: 47 additions & 0 deletions logo.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading

0 comments on commit d654204

Please sign in to comment.