{"id":836,"date":"2026-07-21T08:23:49","date_gmt":"2026-07-21T08:23:49","guid":{"rendered":"https:\/\/aizonic.site\/?page_id=836"},"modified":"2026-07-21T08:26:01","modified_gmt":"2026-07-21T08:26:01","slug":"qr-code-generator","status":"publish","type":"page","link":"https:\/\/aizonic.site\/qr-code-generator\/","title":{"rendered":"QR Code Generator"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"836\" class=\"elementor elementor-836\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5976d83 e-flex e-con-boxed e-con e-parent\" data-id=\"5976d83\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-ebc7161 e-con-full e-flex e-con e-child\" data-id=\"ebc7161\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-17f2e1f e-con-full e-flex e-con e-child\" data-id=\"17f2e1f\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-332d317 elementor-widget__width-initial elementor-widget elementor-widget-image\" data-id=\"332d317\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/aizonic.site\/wp-content\/uploads\/2026\/07\/icon-qr-code-generator.png\" title=\"icon-qr-code-generator\" alt=\"icon-qr-code-generator\" loading=\"lazy\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-17bd8a9 e-con-full e-flex e-con e-child\" data-id=\"17bd8a9\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-26d8d8c e-con-full e-flex e-con e-child\" data-id=\"26d8d8c\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c08d1a2 elementor-widget elementor-widget-heading\" data-id=\"c08d1a2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">QR Code Generator<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-34543b8 elementor-widget elementor-widget-heading\" data-id=\"34543b8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h6 class=\"elementor-heading-title elementor-size-default\">Turn your link into QR code.<\/h6>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-60ed01d e-flex e-con-boxed e-con e-parent\" data-id=\"60ed01d\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-97b79cd elementor-widget elementor-widget-html\" data-id=\"97b79cd\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div id=\"qr-code-generator\" class=\"qr-wrap\">\n  <style>\n    #qr-code-generator {\n      --qr-bg: #14161a; --qr-panel: #1c1f25; --qr-border: #2c303a;\n      --qr-text: #e9ebf0; --qr-muted: #9aa0ac; --qr-accent: #5eead4; --qr-accent-dim: #1f4b45;\n      font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n      color: var(--qr-text); max-width: 720px; margin: 0 auto; box-sizing: border-box;\n    }\n    #qr-code-generator *, #qr-code-generator *::before, #qr-code-generator *::after { box-sizing: border-box; }\n    .qr-card { background: var(--qr-panel); border: 1px solid var(--qr-border); border-radius: 16px; padding: 28px; }\n    .qr-title { font-size: 20px; font-weight: 700; margin: 0 0 4px; letter-spacing: -0.01em; }\n    .qr-subtitle { font-size: 14px; color: var(--qr-muted); margin: 0 0 20px; }\n    .qr-controls { display: flex; flex-wrap: wrap; gap: 16px; }\n    .qr-field { flex: 1; min-width: 160px; }\n    .qr-field-wide { flex: 2; min-width: 220px; }\n    .qr-label { display: block; font-size: 12px; color: var(--qr-muted); margin-bottom: 6px; text-transform: uppercase; letter-spacing: 0.04em; }\n    .qr-input, .qr-select {\n      width: 100%; background: var(--qr-bg); border: 1px solid var(--qr-border); color: var(--qr-text);\n      border-radius: 8px; padding: 9px 10px; font-size: 14px;\n    }\n    .qr-input:focus, .qr-select:focus { outline: 1px solid var(--qr-accent); }\n    .qr-color-row { display: flex; gap: 8px; align-items: center; }\n    .qr-color-row input[type=\"color\"] { width: 40px; height: 36px; padding: 2px; border: 1px solid var(--qr-border); border-radius: 6px; background: var(--qr-bg); cursor: pointer; }\n    .qr-btn { background: var(--qr-accent); color: #05201c; border: none; border-radius: 8px; padding: 10px 18px; font-size: 14px; font-weight: 600; cursor: pointer; }\n    .qr-btn:hover { opacity: 0.9; }\n    .qr-btn-ghost { background: transparent; border: 1px solid var(--qr-border); color: var(--qr-text); }\n    .qr-footer { margin-top: 20px; display: flex; gap: 10px; flex-wrap: wrap; }\n    .qr-preview {\n      margin-top: 22px; display: flex; flex-direction: column; align-items: center; gap: 14px;\n      background: var(--qr-bg); border: 1px solid var(--qr-border); border-radius: 12px; padding: 24px;\n    }\n    .qr-preview canvas { border-radius: 8px; }\n    .qr-empty { font-size: 13px; color: var(--qr-muted); }\n    .qr-note { font-size: 12px; color: var(--qr-muted); margin-top: 14px; line-height: 1.5; }\n  <\/style>\n  <div class=\"qr-card\">\n    <p class=\"qr-title\">QR Code Generator<\/p>\n    <p class=\"qr-subtitle\">Turn any link or text into a downloadable QR code \u2014 generated right in the browser.<\/p>\n\n    <div class=\"qr-controls\">\n      <div class=\"qr-field qr-field-wide\">\n        <label class=\"qr-label\" for=\"qrText\">Link or text<\/label>\n        <input class=\"qr-input\" id=\"qrText\" type=\"text\" placeholder=\"https:\/\/yourwebsite.com\">\n      <\/div>\n      <div class=\"qr-field\">\n        <label class=\"qr-label\" for=\"qrSize\">Size<\/label>\n        <select class=\"qr-select\" id=\"qrSize\">\n          <option value=\"200\">200 x 200<\/option>\n          <option value=\"300\" selected>300 x 300<\/option>\n          <option value=\"500\">500 x 500<\/option>\n          <option value=\"800\">800 x 800<\/option>\n        <\/select>\n      <\/div>\n      <div class=\"qr-field\">\n        <label class=\"qr-label\">Colors<\/label>\n        <div class=\"qr-color-row\">\n          <input type=\"color\" id=\"qrFg\" value=\"#000000\" title=\"Foreground\">\n          <input type=\"color\" id=\"qrBg\" value=\"#ffffff\" title=\"Background\">\n        <\/div>\n      <\/div>\n    <\/div>\n\n    <div class=\"qr-footer\">\n      <button class=\"qr-btn\" id=\"qrGenBtn\">Generate QR code<\/button>\n      <button class=\"qr-btn qr-btn-ghost\" id=\"qrDownloadBtn\" style=\"display:none;\">Download PNG<\/button>\n    <\/div>\n\n    <div class=\"qr-preview\">\n      <p class=\"qr-empty\" id=\"qrEmpty\">Your QR code will appear here.<\/p>\n      <canvas id=\"qrCanvas\" style=\"display:none;\"><\/canvas>\n    <\/div>\n\n    <p class=\"qr-note\">Works for URLs, plain text, phone numbers, or Wi-Fi\/contact strings \u2014 anything a QR scanner can read.<\/p>\n  <\/div>\n<\/div>\n\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/qrious\/4.0.2\/qrious.min.js\"><\/script>\n<script>\n(function () {\n  const wrap = document.getElementById('qr-code-generator');\n  const textInput = wrap.querySelector('#qrText');\n  const sizeSelect = wrap.querySelector('#qrSize');\n  const fgInput = wrap.querySelector('#qrFg');\n  const bgInput = wrap.querySelector('#qrBg');\n  const genBtn = wrap.querySelector('#qrGenBtn');\n  const downloadBtn = wrap.querySelector('#qrDownloadBtn');\n  const canvas = wrap.querySelector('#qrCanvas');\n  const emptyEl = wrap.querySelector('#qrEmpty');\n\n  function generate() {\n    const value = textInput.value.trim();\n    if (!value) {\n      textInput.focus();\n      return;\n    }\n    if (typeof QRious === 'undefined') {\n      emptyEl.textContent = \"QR library didn't load \u2014 check your internet connection and try again.\";\n      return;\n    }\n    new QRious({\n      element: canvas,\n      value: value,\n      size: Number(sizeSelect.value),\n      foreground: fgInput.value,\n      background: bgInput.value,\n      level: 'H'\n    });\n    canvas.style.display = '';\n    emptyEl.style.display = 'none';\n    downloadBtn.style.display = '';\n  }\n\n  genBtn.addEventListener('click', generate);\n  textInput.addEventListener('keydown', e => { if (e.key === 'Enter') generate(); });\n\n  downloadBtn.addEventListener('click', () => {\n    const a = document.createElement('a');\n    a.href = canvas.toDataURL('image\/png');\n    a.download = 'qr-code.png';\n    document.body.appendChild(a);\n    a.click();\n    document.body.removeChild(a);\n  });\n})();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>QR Code Generator Turn your link into QR code. QR Code Generator Turn any link or text into a downloadable [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"disabled","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-836","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/aizonic.site\/wp-json\/wp\/v2\/pages\/836","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/aizonic.site\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/aizonic.site\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/aizonic.site\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/aizonic.site\/wp-json\/wp\/v2\/comments?post=836"}],"version-history":[{"count":4,"href":"https:\/\/aizonic.site\/wp-json\/wp\/v2\/pages\/836\/revisions"}],"predecessor-version":[{"id":841,"href":"https:\/\/aizonic.site\/wp-json\/wp\/v2\/pages\/836\/revisions\/841"}],"wp:attachment":[{"href":"https:\/\/aizonic.site\/wp-json\/wp\/v2\/media?parent=836"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}