Free QR Code Widget for Your Website

Let visitors send the page they're reading to their phone. Embed one HTML snippet and every page on your site gets its own scannable QR code — no accounts, no JavaScript frameworks, no cost.

QR content
Copy this snippet
<!-- QRKit QR Code Widget -->
<div class="qrkit-widget" data-size="160" data-dark="000000" data-light="ffffff">
  <a href="https://useqrkit.com/tools/qr-code-widget?utm_source=widget&utm_medium=embed" target="_blank" rel="noopener">QR code by QRKit</a>
</div>
<script async src="https://useqrkit.com/tools/widget.js"></script>
Scan to open this page on your phone
QR code previewQR code by QRKit

How to embed a QR code on your website

  1. Customize the widget in the builder above — size, colors and the caption shown over the code.
  2. Copy the snippet: one div with the class qrkit-widget plus one async script tag.
  3. Paste it into your page's HTML wherever the QR code should appear. It renders as a crisp, cached SVG — no build step, no plugin.

One snippet, every page: auto-detected URLs

By default the widget encodes the page's canonical URL at load time. Put the snippet in a site-wide template or footer and every page automatically shows its own QR code — a blog post encodes the post, a product page encodes the product. Prefer a fixed target instead? Add a data-urlattribute (or pick "A fixed URL" in the builder) and the QR code always points there, no matter where it's embedded.

Customize the widget with data attributes

  • data-size — QR size in pixels (the builder offers 96–320).
  • data-dark / data-light — foreground and background hex colors, to match your brand.
  • data-title — the caption above the code; set it to an empty string for no caption.
  • data-url — pin a fixed URL instead of auto-detecting the current page.

Works anywhere you can paste HTML

Because the widget is plain HTML plus one script, it works on any platform with a custom-HTML or embed block: WordPress (Custom HTML block), Shopify, Webflow, Squarespace, Ghost, or a hand-written site. No plugin to install and no iframe needed. One caveat: on Wix, embeds run inside a sandboxed iframe, so auto-detection can't see the host page's URL — use the fixed data-url mode there.

Why this widget

  • Free, with no account and no view limits or paid tiers.
  • The loader is about 1 KB gzipped, has no dependencies and loads async, so it doesn't block your page's rendering.
  • The QR code is served as an SVG with immutable cache headers — it stays sharp at any size and loads instantly on repeat views.
  • The only ask is the small "QR code by QRKit" credit link under the code.

Frequently asked questions

Is the QR code widget really free?
Yes. The widget, the QR image API behind it, and unlimited page views are free. No account or attribution fee — the small 'QR code by QRKit' credit link is all we ask.
How does the widget know which URL to encode?
By default it reads the page's canonical URL (or the browser address) at load time, so one snippet works across your whole site. You can also pin a fixed URL with the data-url attribute.
Will it slow my site down?
No. The loader is about 1 KB gzipped with no dependencies, loads async, and the QR image is a cached SVG served with immutable cache headers.
Can I change the colors and size?
Yes — set data-size, data-dark and data-light attributes on the widget div, and data-title to change or remove the caption above the QR code. Or use the builder on this page to generate the snippet.
How do I embed a QR code on my website?
Copy the snippet from the builder on this page and paste it into your page's HTML where the QR code should appear. It works on any platform that lets you add custom HTML — no plugin, no build step, no account.
What HTML do I need to paste?
Two elements: a div with the class qrkit-widget (carrying optional data-size, data-dark, data-light, data-title and data-url attributes) and one async script tag that loads the widget. The builder above generates the exact snippet for you.
Can the QR code point to a fixed URL instead of the current page?
Yes. Add a data-url attribute with your target link (or choose 'A fixed URL' in the builder) and the QR code always encodes that URL, wherever the snippet is embedded.
Can I use it on WordPress, Shopify or Webflow?
Yes — paste the snippet into WordPress's Custom HTML block, a Shopify section, a Webflow embed element, or any other platform with a custom-HTML block. On Wix, embeds run in a sandboxed iframe, so use the fixed data-url mode there.
Can this add a QR code widget to my phone's home screen?
No — this widget is for websites. To put a QR code on your iPhone or Android home screen, use a QR widget app from the App Store or Google Play; to show a QR code on your own site, this tool is the right one.