{"id":5640,"date":"2026-05-07T00:00:00","date_gmt":"2026-05-07T00:00:00","guid":{"rendered":"https:\/\/fonttor.com\/?page_id=5640"},"modified":"2026-05-19T11:48:30","modified_gmt":"2026-05-19T11:48:30","slug":"blackletter","status":"publish","type":"page","link":"https:\/\/fonttor.com\/blackletter\/","title":{"rendered":"Blackletter Font Generator \u2013 Create Instantly Free"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"5640\" class=\"elementor elementor-5640\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6976467c e-con-full e-flex e-con e-parent\" data-id=\"6976467c\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2239f8e2 elementor-widget elementor-widget-shortcode\" data-id=\"2239f8e2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\"><div class=\"blackletter-font-generator-elementor\">\r\n\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\r\n\r\n<script src=\"https:\/\/cdn.jsdelivr.net\/npm\/typed.js@2.0.12\"><\/script>\r\n\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=UnifrakturMaguntia&family=Cinzel+Decorative:wght@700&family=MedievalSharp&family=Grenze+Gotisch:wght@400;700&family=New+Rocker&family=Noto+Serif:wght@400;700&display=swap\" rel=\"stylesheet\">\r\n\r\n<style>\r\n\r\n.blackletter-font-generator-elementor {\r\n\r\n--primary-color: #8b0000;\r\n\r\n--secondary-color: #2c003e;\r\n\r\n--accent-color: #ff6b35;\r\n\r\n--gold-color: #F6D375;\r\n\r\n--gold-dark: #E0A63A;\r\n\r\n--text-color: #e0e0e0;\r\n\r\n--background-color: #121212;\r\n\r\n--card-background: rgba(30, 30, 30, 0.85);\r\n\r\n--border-radius: 8px;\r\n\r\nposition: relative;\r\n\r\nwidth: 100%;\r\n\r\noverflow: hidden;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor * {\r\n\r\nbox-sizing: border-box;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .wrapper {\r\n\r\nmax-width: 1160px;\r\n\r\nmargin: 0 auto !important;\r\n\r\npadding: clamp(0.15rem, 1.2vw, 0.6rem) !important;\r\n\r\nfont-family: 'Arial', sans-serif;\r\n\r\nposition: relative;\r\n\r\nz-index: 10;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .wrapper h1,\r\n\r\n.blackletter-font-generator-elementor .heading {\r\n\r\nfont-size: clamp(1.2rem, 3.5vw, 3rem) !important;\r\n\r\nline-height: 1.2 !important;\r\n\r\nmargin-block: clamp(0.10rem, 1vw, 0.55rem) !important;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .wrapper h2,\r\n\r\n.blackletter-font-generator-elementor .section-title,\r\n\r\n.blackletter-font-generator-elementor .heading-2 {\r\n\r\ncolor: #cbbe5b;\r\n\r\nfont-size: clamp(1rem, 3vw, 2rem) !important;\r\n\r\nline-height: 1.3 !important;\r\n\r\nmargin-block: clamp(0.10rem, 1vw, 0.55rem) !important;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .sub-heading {\r\n\r\nfont-size: clamp(0.85rem, 1.2vw, 1.2rem) !important;\r\n\r\ncolor: #bbb !important;\r\n\r\nmargin-bottom: 25px !important;\r\n\r\nline-height: 1.5 !important;\r\n\r\nmax-width: 800px;\r\n\r\nmargin-left: auto;\r\n\r\nmargin-right: auto;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .wrapper p,\r\n\r\n.blackletter-font-generator-elementor .wrapper input,\r\n\r\n.blackletter-font-generator-elementor .wrapper select,\r\n\r\n.blackletter-font-generator-elementor .wrapper button,\r\n\r\n.blackletter-font-generator-elementor .feature-description,\r\n\r\n.blackletter-font-generator-elementor .content-text {\r\n\r\nfont-size: clamp(0.7rem, .8vw, 1rem) !important;\r\n\r\nline-height: 1.5 !important;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .small-text,\r\n\r\n.blackletter-font-generator-elementor .form-label {\r\n\r\nfont-size: clamp(0.75rem, 1vw, 0.95rem) !important;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .background-wrapper {\r\n\r\nposition: absolute;\r\n\r\ninset: 0;\r\n\r\nwidth: 100%;\r\n\r\nheight: 100%;\r\n\r\nmin-height: 100vh;\r\n\r\nbackground: linear-gradient(135deg, #0a0a1a 0%, #1a0633 50%, #0d1117 100%);\r\n\r\nz-index: 0;\r\n\r\noverflow: hidden;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .particle {\r\n\r\nposition: absolute;\r\n\r\nbackground: radial-gradient(circle, rgba(246, 211, 117, 0.8) 0%, rgba(224, 166, 58, 0.4) 50%, transparent 70%);\r\n\r\nborder-radius: 50%;\r\n\r\npointer-events: none;\r\n\r\nanimation: blfgFloat 15s infinite ease-in-out;\r\n\r\nz-index: 0;\r\n\r\n}\r\n\r\n@keyframes blfgFloat {\r\n\r\n0%, 100% { transform: translateY(0) translateX(0) scale(1); opacity: 0.3; }\r\n\r\n50% { transform: translateY(10px) translateX(-15px) scale(0.9); opacity: 0.4; }\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .heading-wrapper {\r\n\r\ntext-align: center;\r\n\r\nmargin-bottom: 15px !important;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .heading {\r\n\r\nfont-family: 'Cinzel Decorative', 'UnifrakturMaguntia', cursive;\r\n\r\ncolor: var(--gold-color);\r\n\r\ntext-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);\r\n\r\ndisplay: inline-block;\r\n\r\nletter-spacing: 2px;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .input-wrapper {\r\n\r\nmargin-bottom: 10px !important;\r\n\r\nposition: relative;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .text-input {\r\n\r\nwidth: 100% !important;\r\n\r\npadding: clamp(0.15rem, 1.2vw, 0.6rem) 15px !important;\r\n\r\nborder-radius: 10px !important;\r\n\r\nbackground: rgba(20, 20, 40, 0.8) !important;\r\n\r\nborder: 2px solid var(--gold-dark) !important;\r\n\r\ncolor: var(--gold-color) !important;\r\n\r\nfont-family: 'MedievalSharp', cursive !important;\r\n\r\nbox-shadow: 0 0 15px rgba(224, 166, 58, 0.1) !important;\r\n\r\nbox-sizing: border-box !important;\r\n\r\noutline: none;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .quick-presets-wrapper {\r\n\r\nbackground: rgba(30, 30, 50, 0.6);\r\n\r\nborder: 1px solid rgba(224, 166, 58, 0.3);\r\n\r\nborder-radius: 8px;\r\n\r\npadding: 10px !important;\r\n\r\nmargin-bottom: 30px !important;\r\n\r\ndisplay: flex;\r\n\r\nflex-direction: column;\r\n\r\nalign-items: center;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .quick-presets-label {\r\n\r\ncolor: var(--gold-color);\r\n\r\nfont-size: 0.85rem !important;\r\n\r\nmargin-bottom: 8px !important;\r\n\r\ntext-transform: uppercase;\r\n\r\nletter-spacing: 1px;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .unicode-grid {\r\n\r\ndisplay: grid;\r\n\r\ngrid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\r\n\r\ngap: clamp(0.10rem, 1.2vw, 0.65rem) !important;\r\n\r\nmargin-bottom: 30px !important;\r\n\r\nalign-items: stretch;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .unicode-card {\r\n\r\nbackground: var(--card-background);\r\n\r\nborder: 1px solid rgba(224, 166, 58, 0.2);\r\n\r\nborder-radius: 6px;\r\n\r\npadding: clamp(0.45rem, 1.2vw, 0.75rem) !important;\r\n\r\nposition: relative;\r\n\r\ntransition: transform 0.2s, border-color 0.2s, background 0.2s;\r\n\r\ndisplay: flex;\r\n\r\nflex-direction: column;\r\n\r\nheight: 210px;\r\n\r\nmin-height: 210px;\r\n\r\nmax-height: 210px;\r\n\r\noverflow: hidden;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .unicode-card:hover {\r\n\r\nborder-color: var(--gold-color);\r\n\r\nbackground: rgba(40, 40, 50, 0.9);\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .style-label {\r\n\r\nfont-size: clamp(0.7rem, 0.9vw, 0.85rem) !important;\r\n\r\ncolor: var(--accent-color);\r\n\r\nmargin-bottom: 5px !important;\r\n\r\ntext-transform: uppercase;\r\n\r\nletter-spacing: 1px;\r\n\r\nfont-weight: bold;\r\n\r\nflex-shrink: 0;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .preview-text {\r\n\r\nfont-size: 1.2rem !important;\r\n\r\ncolor: var(--gold-color);\r\n\r\nword-break: break-word;\r\n\r\noverflow-wrap: anywhere;\r\n\r\nmargin-bottom: 10px !important;\r\n\r\nmin-height: 1.5em;\r\n\r\nfont-family: 'Segoe UI Symbol', 'Arial Unicode MS', sans-serif;\r\n\r\nflex: 1;\r\n\r\noverflow-y: auto;\r\n\r\noverflow-x: hidden;\r\n\r\npadding-right: 6px;\r\n\r\nscrollbar-width: thin;\r\n\r\nscrollbar-color: var(--gold-dark) rgba(255,255,255,0.08);\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .preview-text::-webkit-scrollbar {\r\n\r\nwidth: 5px;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .preview-text::-webkit-scrollbar-track {\r\n\r\nbackground: rgba(255,255,255,0.08);\r\n\r\nborder-radius: 10px;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .preview-text::-webkit-scrollbar-thumb {\r\n\r\nbackground: var(--gold-dark);\r\n\r\nborder-radius: 10px;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .copy-btn-small {\r\n\r\nalign-self: flex-end;\r\n\r\nbackground: linear-gradient(135deg, #4a148c, #7b1fa2);\r\n\r\nborder: none;\r\n\r\nborder-radius: 4px;\r\n\r\ncolor: white;\r\n\r\npadding: 4px 12px !important;\r\n\r\ncursor: pointer;\r\n\r\nfont-size: 0.8rem !important;\r\n\r\ntransition: 0.3s;\r\n\r\nflex-shrink: 0;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .copy-btn-small:hover {\r\n\r\nopacity: 0.9;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .control-panel {\r\n\r\ndisplay: flex;\r\n\r\nflex-wrap: wrap;\r\n\r\ngap: clamp(0.10rem, 1.2vw, 0.65rem) !important;\r\n\r\nmargin-bottom: 20px !important;\r\n\r\njustify-content: center;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .control-section {\r\n\r\nflex: 1 1 200px;\r\n\r\nbackground: linear-gradient(135deg, rgba(20, 20, 40, 0.9), rgba(30, 30, 50, 0.8));\r\n\r\nborder-radius: 8px;\r\n\r\npadding: clamp(0.15rem, 1.2vw, 0.6rem) !important;\r\n\r\nborder: 1px solid rgba(224, 166, 58, 0.3);\r\n\r\ndisplay: flex;\r\n\r\nflex-direction: column;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .section-header {\r\n\r\ndisplay: flex;\r\n\r\nalign-items: center;\r\n\r\nmargin-bottom: 8px !important;\r\n\r\ncolor: var(--gold-color);\r\n\r\nfont-weight: bold;\r\n\r\nfont-size: clamp(0.75rem, 1vw, 0.95rem) !important;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .section-icon {\r\n\r\nwidth: 24px;\r\n\r\nheight: 24px;\r\n\r\nborder-radius: 50%;\r\n\r\nbackground: linear-gradient(135deg, var(--gold-color), var(--gold-dark));\r\n\r\ndisplay: flex;\r\n\r\nalign-items: center;\r\n\r\njustify-content: center;\r\n\r\nmargin-right: 8px;\r\n\r\nflex-shrink: 0;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .section-icon i {\r\n\r\ncolor: #1a0633;\r\n\r\nfont-size: 12px;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .form-group {\r\n\r\nmargin-bottom: 8px !important;\r\n\r\nwidth: 100%;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .form-select,\r\n\r\n.blackletter-font-generator-elementor .form-input {\r\n\r\nwidth: 100%;\r\n\r\npadding: 6px !important;\r\n\r\nborder-radius: 4px;\r\n\r\nbackground: rgba(10, 10, 20, 0.8);\r\n\r\nborder: 1px solid rgba(224, 166, 58, 0.3);\r\n\r\ncolor: var(--gold-color);\r\n\r\nbox-sizing: border-box;\r\n\r\noutline: none;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .slider-container {\r\n\r\ndisplay: flex;\r\n\r\nalign-items: center;\r\n\r\ngap: 5px !important;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .form-slider {\r\n\r\nflex: 1;\r\n\r\nheight: 4px;\r\n\r\n-webkit-appearance: none;\r\n\r\nappearance: none;\r\n\r\nbackground: rgba(224, 166, 58, 0.2);\r\n\r\nborder-radius: 2px;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .form-slider::-webkit-slider-thumb {\r\n\r\n-webkit-appearance: none;\r\n\r\nwidth: 14px;\r\n\r\nheight: 14px;\r\n\r\nborder-radius: 50%;\r\n\r\nbackground: var(--gold-color);\r\n\r\ncursor: pointer;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .slider-value {\r\n\r\nmin-width: 30px;\r\n\r\ntext-align: center;\r\n\r\ncolor: var(--gold-color);\r\n\r\nfont-size: 0.8rem !important;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .button-group {\r\n\r\ndisplay: flex;\r\n\r\nflex-wrap: wrap;\r\n\r\ngap: clamp(0.10rem, 1.2vw, 0.65rem) !important;\r\n\r\nmargin-bottom: 20px !important;\r\n\r\njustify-content: center;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .btn {\r\n\r\npadding: 8px 16px !important;\r\n\r\nborder-radius: 20px;\r\n\r\nborder: none;\r\n\r\nfont-weight: bold;\r\n\r\ncursor: pointer;\r\n\r\ndisplay: flex;\r\n\r\nalign-items: center;\r\n\r\njustify-content: center;\r\n\r\ngap: 8px;\r\n\r\nflex: 1 1 auto;\r\n\r\nmax-width: 200px;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .btn-primary {\r\n\r\nbackground: linear-gradient(135deg, var(--gold-color), var(--gold-dark));\r\n\r\ncolor: #1a0633;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .btn-secondary {\r\n\r\nbackground: linear-gradient(135deg, #6a3093, #3a7bd5);\r\n\r\ncolor: white;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .output-wrapper {\r\n\r\nbackground: rgba(10, 10, 20, 0.8);\r\n\r\nborder-radius: 8px;\r\n\r\npadding: 20px !important;\r\n\r\nborder: 2px solid rgba(224, 166, 58, 0.3);\r\n\r\ntext-align: center;\r\n\r\nmargin-bottom: 20px !important;\r\n\r\noverflow-x: auto;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .output-text {\r\n\r\nfont-family: 'UnifrakturMaguntia', cursive;\r\n\r\nfont-size: 2rem;\r\n\r\ncolor: var(--gold-color);\r\n\r\nline-height: 1.5;\r\n\r\nwhite-space: pre-wrap;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .preset-buttons-container {\r\n\r\ndisplay: flex;\r\n\r\nflex-wrap: wrap;\r\n\r\ngap: 8px !important;\r\n\r\nwidth: 100%;\r\n\r\njustify-content: center;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .btn-preset {\r\n\r\nflex: 0 1 auto;\r\n\r\nmin-width: 100px;\r\n\r\nbackground: #4a148c;\r\n\r\ncolor: white;\r\n\r\nborder: none;\r\n\r\nborder-radius: 4px;\r\n\r\npadding: 8px 12px !important;\r\n\r\ncursor: pointer;\r\n\r\ndisplay: flex;\r\n\r\nalign-items: center;\r\n\r\njustify-content: center;\r\n\r\ngap: 5px;\r\n\r\nfont-size: 0.8rem !important;\r\n\r\ntransition: all 0.2s ease;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .btn-preset:hover {\r\n\r\nbackground: #6a1b9a;\r\n\r\ntransform: translateY(-2px);\r\n\r\nbox-shadow: 0 4px 8px rgba(0,0,0,0.3);\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .notification {\r\n\r\nposition: fixed;\r\n\r\nbottom: 20px;\r\n\r\nright: 20px;\r\n\r\nbackground: var(--gold-color);\r\n\r\ncolor: #1a0633;\r\n\r\npadding: 10px 20px;\r\n\r\nborder-radius: 5px;\r\n\r\ntransform: translateY(100px);\r\n\r\nopacity: 0;\r\n\r\ntransition: 0.3s;\r\n\r\nz-index: 999999;\r\n\r\nfont-weight: bold;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .notification.show {\r\n\r\ntransform: translateY(0);\r\n\r\nopacity: 1;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .marketing-wrapper {\r\n\r\ncolor: var(--text-color);\r\n\r\npadding-top: 40px;\r\n\r\nfont-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .content-section {\r\n\r\nmargin-bottom: 50px;\r\n\r\nborder-top: 1px solid rgba(255,255,255,0.05);\r\n\r\npadding-top: 30px;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .features-container {\r\n\r\ndisplay: flex;\r\n\r\nflex-wrap: wrap;\r\n\r\ngap: clamp(0.10rem, 1.2vw, 0.65rem) !important;\r\n\r\nmargin-top: 25px;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .feature-card {\r\n\r\nflex: 1 1 300px;\r\n\r\nbackground: var(--card-background);\r\n\r\npadding: 25px !important;\r\n\r\nborder-radius: 8px;\r\n\r\nborder: 1px solid rgba(255,255,255,0.1);\r\n\r\ntransition: transform 0.2s;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .feature-card:hover {\r\n\r\ntransform: translateY(-5px);\r\n\r\nborder-color: var(--gold-color);\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .content-text {\r\n\r\ncolor: #ccc;\r\n\r\nmargin-bottom: 20px !important;\r\n\r\ntext-align: justify;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .content-list {\r\n\r\nlist-style-type: none;\r\n\r\npadding-left: 0;\r\n\r\ncolor: #ccc;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .content-list li {\r\n\r\nmargin-bottom: 10px;\r\n\r\npadding-left: 20px;\r\n\r\nposition: relative;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .content-list li:before {\r\n\r\ncontent: '\u2720';\r\n\r\nposition: absolute;\r\n\r\nleft: 0;\r\n\r\ncolor: var(--gold-color);\r\n\r\nfont-size: 0.8rem;\r\n\r\n}\r\n\r\n@media (max-width: 600px) {\r\n\r\n.blackletter-font-generator-elementor .control-section {\r\n\r\nflex: 1 1 100%;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .unicode-grid {\r\n\r\ngrid-template-columns: 1fr;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .unicode-card {\r\n\r\nheight: 200px;\r\n\r\nmin-height: 200px;\r\n\r\nmax-height: 200px;\r\n\r\n}\r\n\r\n.blackletter-font-generator-elementor .btn-preset {\r\n\r\nflex: 1 1 45%;\r\n\r\n}\r\n\r\n}\r\n\r\n<\/style>\r\n\r\n<div class=\"background-wrapper\" id=\"blfgBackground\"><\/div>\r\n\r\n<div class=\"wrapper\">\r\n\r\n<div class=\"heading-wrapper\">\r\n\r\n<h1 class=\"heading\">Blackletter Font Generator \u2013 Create Instantly Freer<\/h1>\r\n\r\n<p class=\"sub-heading\">Transform modern text into authentic Gothic, Fraktur, and Medieval calligraphy styles with just one click. Generate copy-paste Unicode text or design custom images.<\/p>\r\n\r\n<\/div>\r\n\r\n<div class=\"input-wrapper\">\r\n\r\n<input type=\"text\" class=\"text-input\" id=\"blfgTextInput\" placeholder=\"Type your text here...\" value=\"Blackletter Magic\">\r\n\r\n<\/div>\r\n\r\n<div class=\"quick-presets-wrapper\">\r\n\r\n<div class=\"quick-presets-label\">Quick Generator Styles<\/div>\r\n\r\n<div class=\"preset-buttons-container\">\r\n\r\n<button class=\"btn-preset\" id=\"blfgMedievalPreset\"><i class=\"fas fa-chess-rook\"><\/i> Medieval<\/button>\r\n\r\n<button class=\"btn-preset\" id=\"blfgTattooPreset\"><i class=\"fas fa-dragon\"><\/i> Tattoo<\/button>\r\n\r\n<button class=\"btn-preset\" id=\"blfgModernPreset\"><i class=\"fas fa-city\"><\/i> Modern<\/button>\r\n\r\n<button class=\"btn-preset\" id=\"blfgMinimalPreset\"><i class=\"fas fa-feather\"><\/i> Minimal<\/button>\r\n\r\n<button class=\"btn-preset\" id=\"blfgNeonPreset\"><i class=\"fas fa-bolt\"><\/i> Neon<\/button>\r\n\r\n<button class=\"btn-preset\" id=\"blfgScrollPreset\"><i class=\"fas fa-scroll\"><\/i> Scroll<\/button>\r\n\r\n<\/div>\r\n\r\n<\/div>\r\n\r\n<div class=\"heading-wrapper\" style=\"text-align: left; margin-bottom: 10px;\">\r\n\r\n<h2 class=\"heading-2\" style=\"color: #F6D375; font-size: 1.5rem !important;\">Instant Copy Styles<\/h2>\r\n\r\n<\/div>\r\n\r\n<div id=\"blfgUnicodePreviews\" class=\"unicode-grid\"><\/div>\r\n\r\n<div class=\"heading-wrapper\" style=\"text-align: left; margin-top: 40px; margin-bottom: 10px;\">\r\n\r\n<h2 class=\"heading-2\" style=\"color: #F6D375; font-size: 1.5rem !important;\">Custom Image Generator<\/h2>\r\n\r\n<\/div>\r\n\r\n<div class=\"control-panel\">\r\n\r\n<div class=\"control-section\">\r\n\r\n<div class=\"section-header\">\r\n\r\n<div class=\"section-icon\"><i class=\"fas fa-font\"><\/i><\/div>\r\n\r\n<span>Font Style<\/span>\r\n\r\n<\/div>\r\n\r\n<div class=\"form-group\">\r\n\r\n<select class=\"form-select\" id=\"blfgFontStyle\">\r\n\r\n<option value=\"UnifrakturMaguntia\">Classic Blackletter<\/option>\r\n\r\n<option value=\"Cinzel Decorative\">Gothic<\/option>\r\n\r\n<option value=\"MedievalSharp\">Fraktur<\/option>\r\n\r\n<option value=\"Grenze Gotisch\">Modern Blackletter<\/option>\r\n\r\n<option value=\"New Rocker\">Tattoo Gothic<\/option>\r\n\r\n<\/select>\r\n\r\n<\/div>\r\n\r\n<div class=\"form-group\">\r\n\r\n<label class=\"form-label\">Size (px)<\/label>\r\n\r\n<div class=\"slider-container\">\r\n\r\n<input type=\"range\" class=\"form-slider\" id=\"blfgFontSize\" min=\"12\" max=\"120\" value=\"32\">\r\n\r\n<span class=\"slider-value\" id=\"blfgFontSizeValue\">32<\/span>\r\n\r\n<\/div>\r\n\r\n<\/div>\r\n\r\n<\/div>\r\n\r\n<div class=\"control-section\">\r\n\r\n<div class=\"section-header\">\r\n\r\n<div class=\"section-icon\"><i class=\"fas fa-palette\"><\/i><\/div>\r\n\r\n<span>Colors & Effects<\/span>\r\n\r\n<\/div>\r\n\r\n<div class=\"slider-container\" style=\"margin-bottom: 5px;\">\r\n\r\n<label class=\"form-label\" style=\"width: 50px;\">Text<\/label>\r\n\r\n<input type=\"color\" class=\"form-input\" id=\"blfgTextColor\" value=\"#F6D375\" style=\"height: 30px;\">\r\n\r\n<\/div>\r\n\r\n<div class=\"slider-container\" style=\"margin-bottom: 5px;\">\r\n\r\n<label class=\"form-label\" style=\"width: 50px;\">Bg<\/label>\r\n\r\n<input type=\"color\" class=\"form-input\" id=\"blfgBgColor\" value=\"#0a0a1a\" style=\"height: 30px;\">\r\n\r\n<\/div>\r\n\r\n<div class=\"form-group\">\r\n\r\n<label class=\"form-label\">Shadow<\/label>\r\n\r\n<div class=\"slider-container\">\r\n\r\n<input type=\"range\" class=\"form-slider\" id=\"blfgShadowIntensity\" min=\"0\" max=\"20\" value=\"10\">\r\n\r\n<span class=\"slider-value\" id=\"blfgShadowIntensityValue\">10<\/span>\r\n\r\n<\/div>\r\n\r\n<\/div>\r\n\r\n<\/div>\r\n\r\n<\/div>\r\n\r\n<div class=\"button-group\">\r\n\r\n<button class=\"btn btn-primary\" id=\"blfgGenerateBtn\"><i class=\"fas fa-magic\"><\/i> Generate<\/button>\r\n\r\n<button class=\"btn btn-secondary\" id=\"blfgDownloadPngBtn\"><i class=\"fas fa-download\"><\/i> PNG<\/button>\r\n\r\n<button class=\"btn btn-secondary\" id=\"blfgCopyBtn\"><i class=\"fas fa-copy\"><\/i> Copy<\/button>\r\n\r\n<button class=\"btn btn-primary\" id=\"blfgResetBtn\"><i class=\"fas fa-undo\"><\/i> Reset<\/button>\r\n\r\n<\/div>\r\n\r\n<div class=\"output-wrapper\" id=\"blfgOutputWrapper\">\r\n\r\n<div class=\"output-text\" id=\"blfgOutputText\">Blackletter Magic<\/div>\r\n\r\n<\/div>\r\n\r\n<\/div>\r\n\r\n<div class=\"notification\" id=\"blfgNotification\"><\/div>\r\n\r\n<script>\r\n\r\n(function() {\r\n\r\nconst unicodeStyles = [\r\n\r\n{ name: \"Gothic Blackletter Heavy\", type: \"map\", map: {'A':'\ud835\udd04','B':'\ud835\udd05','C':'\u212d','D':'\ud835\udd07','E':'\ud835\udd08','F':'\ud835\udd09','G':'\ud835\udd0a','H':'\u210c','I':'\u2111','J':'\ud835\udd0d','K':'\ud835\udd0e','L':'\ud835\udd0f','M':'\ud835\udd10','N':'\ud835\udd11','O':'\ud835\udd12','P':'\ud835\udd13','Q':'\ud835\udd14','R':'\u211c','S':'\ud835\udd16','T':'\ud835\udd17','U':'\ud835\udd18','V':'\ud835\udd19','W':'\ud835\udd1a','X':'\ud835\udd1b','Y':'\ud835\udd1c','Z':'\u2128','a':'\ud835\udd1e','b':'\ud835\udd1f','c':'\ud835\udd20','d':'\ud835\udd21','e':'\ud835\udd22','f':'\ud835\udd23','g':'\ud835\udd24','h':'\ud835\udd25','i':'\ud835\udd26','j':'\ud835\udd27','k':'\ud835\udd28','l':'\ud835\udd29','m':'\ud835\udd2a','n':'\ud835\udd2b','o':'\ud835\udd2c','p':'\ud835\udd2d','q':'\ud835\udd2e','r':'\ud835\udd2f','s':'\ud835\udd30','t':'\ud835\udd31','u':'\ud835\udd32','v':'\ud835\udd33','w':'\ud835\udd34','x':'\ud835\udd35','y':'\ud835\udd36','z':'\ud835\udd37'} },\r\n\r\n{ name: \"Medieval Blackletter Thin\", type: \"map\", map: {'A':'\ud835\udd6c','B':'\ud835\udd6d','C':'\ud835\udd6e','D':'\ud835\udd6f','E':'\ud835\udd70','F':'\ud835\udd71','G':'\ud835\udd72','H':'\ud835\udd73','I':'\ud835\udd74','J':'\ud835\udd75','K':'\ud835\udd76','L':'\ud835\udd77','M':'\ud835\udd78','N':'\ud835\udd79','O':'\ud835\udd7a','P':'\ud835\udd7b','Q':'\ud835\udd7c','R':'\ud835\udd7d','S':'\ud835\udd7e','T':'\ud835\udd7f','U':'\ud835\udd80','V':'\ud835\udd81','W':'\ud835\udd82','X':'\ud835\udd83','Y':'\ud835\udd84','Z':'\ud835\udd85','a':'\ud835\udd86','b':'\ud835\udd87','c':'\ud835\udd88','d':'\ud835\udd89','e':'\ud835\udd8a','f':'\ud835\udd8b','g':'\ud835\udd8c','h':'\ud835\udd8d','i':'\ud835\udd8e','j':'\ud835\udd8f','k':'\ud835\udd90','l':'\ud835\udd91','m':'\ud835\udd92','n':'\ud835\udd93','o':'\ud835\udd94','p':'\ud835\udd95','q':'\ud835\udd96','r':'\ud835\udd97','s':'\ud835\udd98','t':'\ud835\udd99','u':'\ud835\udd9a','v':'\ud835\udd9b','w':'\ud835\udd9c','x':'\ud835\udd9d','y':'\ud835\udd9e','z':'\ud835\udd9f'} },\r\n\r\n{ name: \"Gothic Sharp Engrave\", type: \"join\", char: '\\u0337' },\r\n\r\n{ name: \"Dark Rune-Blackletter\", type: \"map\", map: {'A':'\u16a8','B':'\u16d2','C':'\u16e3','D':'\u16de','E':'\u16d6','F':'\u16a0','G':'\u16b7','H':'\u16ba','I':'\u16c1','J':'\u16c3','K':'\u16b2','L':'\u16da','M':'\u16d7','N':'\u16be','O':'\u16df','P':'\u16c8','Q':'\u16e9','R':'\u16b1','S':'\u16ca','T':'\u16cf','U':'\u16a2','V':'\u16a1','W':'\u16b9','X':'\u16ea','Y':'\u16e6','Z':'\u16c9','a':'\u16a8','b':'\u16d2','c':'\u16e3','d':'\u16de','e':'\u16d6','f':'\u16a0','g':'\u16b7','h':'\u16ba','i':'\u16c1','j':'\u16c3','k':'\u16b2','l':'\u16da','m':'\u16d7','n':'\u16be','o':'\u16df','p':'\u16c8','q':'\u16e9','r':'\u16b1','s':'\u16ca','t':'\u16cf','u':'\u16a2','v':'\u16a1','w':'\u16b9','x':'\u16ea','y':'\u16e6','z':'\u16c9'} },\r\n\r\n{ name: \"Fragmented Blackletter\", type: \"join\", char: '\\u0353' },\r\n\r\n{ name: \"Ancient Scroll Gothic\", type: \"join\", char: '\\u0487' },\r\n\r\n{ name: \"Blackletter Stained-Ink\", type: \"join\", char: '\\u033D' },\r\n\r\n{ name: \"Heavy Fraktur Bold\", type: \"map\", map: {'A':'\ud835\udda0','B':'\ud835\udda1','C':'\ud835\udda2','D':'\ud835\udda3','E':'\ud835\udda4','F':'\ud835\udda5','G':'\ud835\udda6','H':'\ud835\udda8','I':'\ud835\udda8','J':'\ud835\udda9','K':'\ud835\uddaa','L':'\ud835\uddab','M':'\ud835\uddac','N':'\ud835\uddad','O':'\ud835\uddae','P':'\ud835\uddaf','Q':'\ud835\uddb0','R':'\ud835\uddb1','S':'\ud835\uddb2','T':'\ud835\uddb3','U':'\ud835\uddb4','V':'\ud835\uddb5','W':'\ud835\uddb6','X':'\ud835\uddb7','Y':'\ud835\uddb8','Z':'\ud835\uddb9','a':'\ud835\uddba','b':'\ud835\uddbb','c':'\ud835\uddbc','d':'\ud835\uddbd','e':'\ud835\uddbe','f':'\ud835\uddbf','g':'\ud835\uddc0','h':'\ud835\uddc1','i':'\ud835\uddc2','j':'\ud835\uddc3','k':'\ud835\uddc4','l':'\ud835\uddc5','m':'\ud835\uddc6','n':'\ud835\uddc7','o':'\ud835\uddc8','p':'\ud835\uddc9','q':'\ud835\uddca','r':'\ud835\uddcb','s':'\ud835\uddcc','t':'\ud835\uddcd','u':'\ud835\uddce','v':'\ud835\uddcf','w':'\ud835\uddd0','x':'\ud835\uddd1','y':'\ud835\uddd2','z':'\ud835\uddd3'} },\r\n\r\n{ name: \"Medieval Textured\", type: \"join\", char: '\\u0359' },\r\n\r\n{ name: \"Gothic Spire Style\", type: \"join\", char: '\\u0489' },\r\n\r\n{ name: \"Soft Blackletter Curved\", type: \"join\", char: '\\u035B' },\r\n\r\n{ name: \"Worn-Ink Medieval\", type: \"join\", char: '\\u033E' },\r\n\r\n{ name: \"Gothic Crowned\", type: \"join\", char: '\\u048C' },\r\n\r\n{ name: \"Blackletter Outline\", type: \"join\", char: '\\u20D2' },\r\n\r\n{ name: \"Shadowed Gothic\", type: \"join\", char: '\\u0362' },\r\n\r\n{ name: \"Medieval Curtain Caps\", type: \"join\", char: '\\u0482' },\r\n\r\n{ name: \"Embossed Fraktur\", type: \"join\", char: '\\u20D7' },\r\n\r\n{ name: \"Charcoal Gothic\", type: \"join\", char: '\\u033C' },\r\n\r\n{ name: \"Faded Cathedral Script\", type: \"join\", char: '\\u0339' },\r\n\r\n{ name: \"Torn Gothic Paper\", type: \"join\", char: '\\u0334' },\r\n\r\n{ name: \"Blackletter Embroidered\", type: \"append\", char: '\u2720' }\r\n\r\n];\r\n\r\nconst root = document.querySelector('.blackletter-font-generator-elementor');\r\n\r\nconst textInput = root.querySelector('#blfgTextInput');\r\n\r\nconst outputText = root.querySelector('#blfgOutputText');\r\n\r\nconst outputWrapper = root.querySelector('#blfgOutputWrapper');\r\n\r\nconst fontStyle = root.querySelector('#blfgFontStyle');\r\n\r\nconst fontSize = root.querySelector('#blfgFontSize');\r\n\r\nconst fontSizeValue = root.querySelector('#blfgFontSizeValue');\r\n\r\nconst textColor = root.querySelector('#blfgTextColor');\r\n\r\nconst bgColor = root.querySelector('#blfgBgColor');\r\n\r\nconst shadowIntensity = root.querySelector('#blfgShadowIntensity');\r\n\r\nconst shadowIntensityValue = root.querySelector('#blfgShadowIntensityValue');\r\n\r\nconst notification = root.querySelector('#blfgNotification');\r\n\r\nfunction generateUnicodeText(text, style) {\r\n\r\nif (!text) return \"\";\r\n\r\nlet result = \"\";\r\n\r\nif (style.type === \"map\") {\r\n\r\nfor (let char of text) {\r\n\r\nresult += style.map[char] || char;\r\n\r\nresult += \" \";\r\n\r\n}\r\n\r\n} else if (style.type === \"join\") {\r\n\r\nfor (let char of text) {\r\n\r\nif (char === ' ') result += '  ';\r\n\r\nelse result += char + style.char + \" \";\r\n\r\n}\r\n\r\n} else if (style.type === \"append\") {\r\n\r\nfor (let char of text) {\r\n\r\nif (char === ' ') result += '  ';\r\n\r\nelse result += char + style.char + \" \";\r\n\r\n}\r\n\r\n}\r\n\r\nreturn result.trim();\r\n\r\n}\r\n\r\nfunction copyText(value) {\r\n\r\nif (navigator.clipboard && window.isSecureContext) {\r\n\r\nreturn navigator.clipboard.writeText(value);\r\n\r\n}\r\n\r\nconst textarea = document.createElement('textarea');\r\n\r\ntextarea.value = value;\r\n\r\ntextarea.style.position = 'fixed';\r\n\r\ntextarea.style.left = '-9999px';\r\n\r\ndocument.body.appendChild(textarea);\r\n\r\ntextarea.focus();\r\n\r\ntextarea.select();\r\n\r\ndocument.execCommand('copy');\r\n\r\ntextarea.remove();\r\n\r\nreturn Promise.resolve();\r\n\r\n}\r\n\r\nfunction renderUnicodePreviews(inputText) {\r\n\r\nconst container = root.querySelector('#blfgUnicodePreviews');\r\n\r\ncontainer.innerHTML = '';\r\n\r\nconst text = inputText || \"Blackletter Magic\";\r\n\r\nunicodeStyles.forEach(function(style) {\r\n\r\nconst transformed = generateUnicodeText(text, style);\r\n\r\nconst card = document.createElement('div');\r\n\r\ncard.className = 'unicode-card';\r\n\r\nconst label = document.createElement('div');\r\n\r\nlabel.className = 'style-label';\r\n\r\nlabel.innerText = style.name;\r\n\r\nconst preview = document.createElement('div');\r\n\r\npreview.className = 'preview-text';\r\n\r\npreview.innerText = transformed;\r\n\r\nconst btn = document.createElement('button');\r\n\r\nbtn.className = 'copy-btn-small';\r\n\r\nbtn.innerHTML = '<i class=\"fas fa-copy\"><\/i> Copy';\r\n\r\nbtn.addEventListener('click', function() {\r\n\r\ncopyText(transformed).then(function() {\r\n\r\nshowNotification('Copied: ' + style.name);\r\n\r\n});\r\n\r\n});\r\n\r\ncard.appendChild(label);\r\n\r\ncard.appendChild(preview);\r\n\r\ncard.appendChild(btn);\r\n\r\ncontainer.appendChild(card);\r\n\r\n});\r\n\r\n}\r\n\r\nfunction updateOutput() {\r\n\r\nconst text = textInput.value || 'Blackletter Magic';\r\n\r\noutputText.textContent = text;\r\n\r\noutputText.style.fontFamily = fontStyle.value;\r\n\r\noutputText.style.fontSize = fontSize.value + 'px';\r\n\r\noutputText.style.color = textColor.value;\r\n\r\noutputText.style.textShadow = '0 0 ' + shadowIntensity.value + 'px ' + textColor.value;\r\n\r\n}\r\n\r\nfunction showNotification(msg) {\r\n\r\nnotification.textContent = msg;\r\n\r\nnotification.classList.add('show');\r\n\r\nsetTimeout(function() {\r\n\r\nnotification.classList.remove('show');\r\n\r\n}, 2500);\r\n\r\n}\r\n\r\nfunction applyPreset(font, size, color, shadow, bg) {\r\n\r\nfontStyle.value = font;\r\n\r\nfontSize.value = size;\r\n\r\nfontSizeValue.innerText = size;\r\n\r\ntextColor.value = color;\r\n\r\nshadowIntensity.value = shadow;\r\n\r\nshadowIntensityValue.innerText = shadow;\r\n\r\nif (bg) {\r\n\r\nbgColor.value = bg;\r\n\r\noutputWrapper.style.backgroundColor = bg;\r\n\r\n}\r\n\r\nupdateOutput();\r\n\r\nshowNotification('Preset applied!');\r\n\r\n}\r\n\r\nfunction downloadAsImage() {\r\n\r\nconst canvas = document.createElement('canvas');\r\n\r\nconst ctx = canvas.getContext('2d');\r\n\r\nconst scale = 3;\r\n\r\nconst padding = 40;\r\n\r\nconst text = outputText.textContent;\r\n\r\nctx.font = fontSize.value + 'px ' + fontStyle.value;\r\n\r\nconst textMetrics = ctx.measureText(text);\r\n\r\ncanvas.width = (textMetrics.width + padding * 2) * scale;\r\n\r\ncanvas.height = (parseInt(fontSize.value, 10) * 1.5 + padding * 2) * scale;\r\n\r\nctx.scale(scale, scale);\r\n\r\nctx.fillStyle = bgColor.value;\r\n\r\nctx.fillRect(0, 0, canvas.width \/ scale, canvas.height \/ scale);\r\n\r\nctx.font = fontSize.value + 'px ' + fontStyle.value;\r\n\r\nctx.fillStyle = textColor.value;\r\n\r\nctx.textAlign = 'center';\r\n\r\nctx.textBaseline = 'middle';\r\n\r\nif (parseInt(shadowIntensity.value, 10) > 0) {\r\n\r\nctx.shadowColor = textColor.value;\r\n\r\nctx.shadowBlur = shadowIntensity.value;\r\n\r\n}\r\n\r\nctx.fillText(text, (canvas.width \/ scale) \/ 2, (canvas.height \/ scale) \/ 2);\r\n\r\nconst link = document.createElement('a');\r\n\r\nlink.download = 'blackletter-art.png';\r\n\r\nlink.href = canvas.toDataURL();\r\n\r\nlink.click();\r\n\r\n}\r\n\r\nfunction createBackgroundElements() {\r\n\r\nconst bg = root.querySelector('#blfgBackground');\r\n\r\nbg.innerHTML = '';\r\n\r\nfor (let i = 0; i < 20; i++) {\r\n\r\nconst p = document.createElement('div');\r\n\r\np.className = 'particle';\r\n\r\np.style.width = Math.random() * 100 + 20 + 'px';\r\n\r\np.style.height = p.style.width;\r\n\r\np.style.left = Math.random() * 100 + '%';\r\n\r\np.style.top = Math.random() * 100 + '%';\r\n\r\np.style.animationDuration = (10 + Math.random() * 10) + 's';\r\n\r\nbg.appendChild(p);\r\n\r\n}\r\n\r\n}\r\n\r\nfontSize.addEventListener('input', function() {\r\n\r\nfontSizeValue.textContent = fontSize.value;\r\n\r\nupdateOutput();\r\n\r\n});\r\n\r\nshadowIntensity.addEventListener('input', function() {\r\n\r\nshadowIntensityValue.textContent = shadowIntensity.value;\r\n\r\nupdateOutput();\r\n\r\n});\r\n\r\ntextInput.addEventListener('input', function() {\r\n\r\nupdateOutput();\r\n\r\nrenderUnicodePreviews(textInput.value);\r\n\r\n});\r\n\r\nfontStyle.addEventListener('change', updateOutput);\r\n\r\ntextColor.addEventListener('input', updateOutput);\r\n\r\nbgColor.addEventListener('input', function() {\r\n\r\noutputWrapper.style.backgroundColor = bgColor.value;\r\n\r\n});\r\n\r\nroot.querySelector('#blfgGenerateBtn').addEventListener('click', function() {\r\n\r\nupdateOutput();\r\n\r\nrenderUnicodePreviews(textInput.value);\r\n\r\nshowNotification('Styles Generated!');\r\n\r\n});\r\n\r\nroot.querySelector('#blfgCopyBtn').addEventListener('click', function() {\r\n\r\ncopyText(outputText.textContent).then(function() {\r\n\r\nshowNotification('Canvas text copied!');\r\n\r\n});\r\n\r\n});\r\n\r\nroot.querySelector('#blfgResetBtn').addEventListener('click', function() {\r\n\r\ntextInput.value = 'Blackletter Magic';\r\n\r\nfontSize.value = 32;\r\n\r\nfontSizeValue.innerText = 32;\r\n\r\nshadowIntensity.value = 10;\r\n\r\nshadowIntensityValue.innerText = 10;\r\n\r\ntextColor.value = '#F6D375';\r\n\r\nbgColor.value = '#0a0a1a';\r\n\r\noutputWrapper.style.backgroundColor = '#0a0a1a';\r\n\r\nupdateOutput();\r\n\r\nrenderUnicodePreviews('Blackletter Magic');\r\n\r\n});\r\n\r\nroot.querySelector('#blfgDownloadPngBtn').addEventListener('click', downloadAsImage);\r\n\r\nroot.querySelector('#blfgMedievalPreset').addEventListener('click', function() {\r\n\r\napplyPreset('UnifrakturMaguntia', 48, '#C7791D', 15);\r\n\r\n});\r\n\r\nroot.querySelector('#blfgTattooPreset').addEventListener('click', function() {\r\n\r\napplyPreset('New Rocker', 36, '#F6D375', 5);\r\n\r\n});\r\n\r\nroot.querySelector('#blfgModernPreset').addEventListener('click', function() {\r\n\r\napplyPreset('Grenze Gotisch', 42, '#a044ff', 10);\r\n\r\n});\r\n\r\nroot.querySelector('#blfgMinimalPreset').addEventListener('click', function() {\r\n\r\napplyPreset('MedievalSharp', 28, '#e0e0e0', 2);\r\n\r\n});\r\n\r\nroot.querySelector('#blfgNeonPreset').addEventListener('click', function() {\r\n\r\napplyPreset('Grenze Gotisch', 40, '#00ff00', 20, '#000000');\r\n\r\n});\r\n\r\nroot.querySelector('#blfgScrollPreset').addEventListener('click', function() {\r\n\r\napplyPreset('UnifrakturMaguntia', 38, '#3e2723', 0, '#d7ccc8');\r\n\r\n});\r\n\r\ncreateBackgroundElements();\r\n\r\nupdateOutput();\r\n\r\nrenderUnicodePreviews(textInput.value);\r\n\r\nif (typeof Typed !== 'undefined') {\r\n\r\nnew Typed('#blfgTextInput', {\r\n\r\nstrings: ['Blackletter Magic', 'Gothic Art', 'Medieval Text'],\r\n\r\ntypeSpeed: 50,\r\n\r\nbackSpeed: 30,\r\n\r\nloop: true,\r\n\r\nattr: 'placeholder',\r\n\r\nshowCursor: false\r\n\r\n});\r\n\r\n}\r\n\r\n})();\r\n\r\n<\/script>\r\n\r\n<\/div>\r\n\r\n\r\n<!-- <content section is starting -->\r\n\r\n<div class=\"fgblackletterfontgenerator-content-wrapper\">\r\n\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.1\/css\/all.min.css\">\r\n\r\n<style>\r\n.fgblackletterfontgenerator-content-wrapper,\r\n.fgblackletterfontgenerator-content-wrapper * {\r\n  box-sizing: border-box;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper {\r\n  --fg-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Arial, sans-serif;\r\n  --fg-text: #10201f;\r\n  --fg-muted: #5d6f70;\r\n  --fg-border: rgba(15, 23, 42, 0.12);\r\n  --fg-shadow: 0 18px 46px rgba(15, 23, 42, 0.08);\r\n  --fg-radius: 24px;\r\n  --fg-brand-1: #111827;\r\n  --fg-brand-2: #991B1B;\r\n  --fg-brand-3: #FECACA;\r\n  --fg-soft: #f8fafc;\r\n  --fg-glow: rgba(17,24,39,.16);\r\n  width: 100%;\r\n  display: block;\r\n  font-family: var(--fg-font) !important;\r\n  color: var(--fg-text) !important;\r\n  overflow: hidden;\r\n  -webkit-font-smoothing: antialiased;\r\n  text-rendering: geometricPrecision;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper h1,\r\n.fgblackletterfontgenerator-content-wrapper h2,\r\n.fgblackletterfontgenerator-content-wrapper h3,\r\n.fgblackletterfontgenerator-content-wrapper h4,\r\n.fgblackletterfontgenerator-content-wrapper h5,\r\n.fgblackletterfontgenerator-content-wrapper h6,\r\n.fgblackletterfontgenerator-content-wrapper p {\r\n  margin-top: 0 !important;\r\n  margin-bottom: 0 !important;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-content-section {\r\n  width: 100%;\r\n  display: block;\r\n  padding: 74px 20px;\r\n  position: relative;\r\n  overflow: hidden;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-section-white {\r\n  background: #ffffff !important;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-section-soft {\r\n  background:\r\n    radial-gradient(circle at 82% 20%, rgba(255, 255, 255, 0.30), transparent 24%),\r\n    linear-gradient(135deg, #016B61 0%, #70B2B2 52%, #9ECFD4 100%) !important;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-inner-container {\r\n  width: 100%;\r\n  max-width: 1200px;\r\n  margin-left: auto;\r\n  margin-right: auto;\r\n  position: relative;\r\n  z-index: 1;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-section-heading-wrap {\r\n  max-width: 860px;\r\n  margin: 0 auto 36px auto;\r\n  text-align: center;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-section-title {\r\n  margin: 0 0 12px 0 !important;\r\n  padding: 0 !important;\r\n  font-family: var(--fg-font) !important;\r\n  font-size: clamp(24px, 2.7vw, 35px) !important;\r\n  font-weight: 760 !important;\r\n  line-height: 1.22 !important;\r\n  letter-spacing: -0.025em !important;\r\n  color: #10201f !important;\r\n  text-align: center !important;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-section-soft .fgblackletterfontgenerator-section-title {\r\n  color: #ffffff !important;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-keyword-gradient {\r\n  background: linear-gradient(135deg, var(--fg-brand-1), var(--fg-brand-2), var(--fg-brand-3));\r\n  -webkit-background-clip: text;\r\n  -webkit-text-fill-color: transparent;\r\n  background-clip: text;\r\n  display: inline-block;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-section-soft .fgblackletterfontgenerator-keyword-gradient {\r\n  background: linear-gradient(135deg, #ffffff 0%, #efffff 50%, #dff7f8 100%);\r\n  -webkit-background-clip: text;\r\n  -webkit-text-fill-color: transparent;\r\n  background-clip: text;\r\n  text-shadow: 0 10px 24px rgba(0, 0, 0, 0.08);\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-section-subtitle {\r\n  margin: 0 auto !important;\r\n  padding: 0 !important;\r\n  max-width: 760px;\r\n  text-align: center !important;\r\n  font-family: var(--fg-font) !important;\r\n  font-size: clamp(15px, 1.45vw, 17px) !important;\r\n  font-weight: 400 !important;\r\n  line-height: 1.68 !important;\r\n  color: var(--fg-muted) !important;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-section-soft .fgblackletterfontgenerator-section-subtitle {\r\n  color: rgba(255, 255, 255, 0.90) !important;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-card-grid {\r\n  display: grid !important;\r\n  grid-template-columns: repeat(3, minmax(0, 1fr));\r\n  gap: 22px;\r\n  align-items: stretch;\r\n  width: 100%;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-second-grid {\r\n  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-feature-card {\r\n  --card-c1: var(--fg-brand-1);\r\n  --card-c2: var(--fg-brand-2);\r\n  --card-soft: var(--fg-soft);\r\n  --card-glow: var(--fg-glow);\r\n  --fg-mx: 50%;\r\n  --fg-my: 18%;\r\n  --fg-tilt-x: 0deg;\r\n  --fg-tilt-y: 0deg;\r\n  position: relative;\r\n  width: 100%;\r\n  min-height: 100%;\r\n  display: flex !important;\r\n  flex-direction: column;\r\n  padding: 26px;\r\n  border: 1px solid var(--fg-border);\r\n  border-radius: var(--fg-radius);\r\n  background:\r\n    radial-gradient(circle at var(--fg-mx) var(--fg-my), var(--card-glow), transparent 34%),\r\n    linear-gradient(180deg, rgba(255,255,255,0.99), rgba(255,255,255,0.94));\r\n  box-shadow: var(--fg-shadow);\r\n  transform: translateY(18px);\r\n  opacity: 0;\r\n  transition: transform 420ms ease, opacity 420ms ease, border-color 260ms ease, box-shadow 260ms ease, background 260ms ease;\r\n  overflow: hidden;\r\n  isolation: isolate;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-card-grid .fgblackletterfontgenerator-feature-card:nth-child(1) {\r\n  --card-c1: #111827;\r\n  --card-c2: #991B1B;\r\n  --card-soft: #f8fafc;\r\n  --card-glow: rgba(17,24,39,.16);\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-card-grid .fgblackletterfontgenerator-feature-card:nth-child(2) {\r\n  --card-c1: #0f766e;\r\n  --card-c2: #2dd4bf;\r\n  --card-soft: rgba(204, 251, 241, 0.96);\r\n  --card-glow: rgba(20, 184, 166, 0.17);\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-card-grid .fgblackletterfontgenerator-feature-card:nth-child(3) {\r\n  --card-c1: #2563eb;\r\n  --card-c2: #06b6d4;\r\n  --card-soft: rgba(224, 242, 254, 0.96);\r\n  --card-glow: rgba(37, 99, 235, 0.15);\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-card-grid .fgblackletterfontgenerator-feature-card:nth-child(4) {\r\n  --card-c1: #7c3aed;\r\n  --card-c2: #a855f7;\r\n  --card-soft: rgba(243, 232, 255, 0.96);\r\n  --card-glow: rgba(124, 58, 237, 0.15);\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-card-grid .fgblackletterfontgenerator-feature-card:nth-child(5) {\r\n  --card-c1: #f97316;\r\n  --card-c2: #f59e0b;\r\n  --card-soft: rgba(255, 247, 237, 0.96);\r\n  --card-glow: rgba(249, 115, 22, 0.15);\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-card-grid .fgblackletterfontgenerator-feature-card:nth-child(6) {\r\n  --card-c1: #db2777;\r\n  --card-c2: #ec4899;\r\n  --card-soft: rgba(252, 231, 243, 0.96);\r\n  --card-glow: rgba(219, 39, 119, 0.15);\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-card-grid .fgblackletterfontgenerator-feature-card:nth-child(7) {\r\n  --card-c1: #0891b2;\r\n  --card-c2: #22c55e;\r\n  --card-soft: rgba(236, 253, 245, 0.96);\r\n  --card-glow: rgba(34, 197, 94, 0.16);\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-card-grid .fgblackletterfontgenerator-feature-card:nth-child(8) {\r\n  --card-c1: #4f46e5;\r\n  --card-c2: #06b6d4;\r\n  --card-soft: rgba(238, 242, 255, 0.96);\r\n  --card-glow: rgba(79, 70, 229, 0.15);\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-feature-card.fgblackletterfontgenerator-card-visible {\r\n  transform: translateY(0);\r\n  opacity: 1;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-feature-card::before,\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-feature-card::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  pointer-events: none;\r\n  z-index: 0;\r\n  transition: opacity 320ms ease, transform 420ms ease, width 320ms ease, height 320ms ease;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-feature-card::before {\r\n  width: 180px;\r\n  height: 180px;\r\n  right: -78px;\r\n  top: -78px;\r\n  border-radius: 999px;\r\n  background: radial-gradient(circle, var(--card-glow), transparent 72%);\r\n  opacity: 0;\r\n  transform: scale(0.76);\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-feature-card::after {\r\n  width: 0;\r\n  height: 3px;\r\n  left: 26px;\r\n  bottom: 0;\r\n  border-radius: 999px;\r\n  background: linear-gradient(90deg, var(--card-c1), var(--card-c2));\r\n  opacity: 0;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-feature-card:hover {\r\n  border-color: rgba(15, 23, 42, 0.16);\r\n  box-shadow: 0 24px 58px var(--card-glow);\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-feature-card:hover::before {\r\n  opacity: 1;\r\n  transform: scale(1);\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-icon-wrap {\r\n  width: 72px !important;\r\n  height: 72px !important;\r\n  min-width: 72px !important;\r\n  min-height: 72px !important;\r\n  display: inline-flex !important;\r\n  align-items: center !important;\r\n  justify-content: center !important;\r\n  flex: 0 0 auto !important;\r\n  border-radius: 22px;\r\n  margin: 0 0 20px 0 !important;\r\n  position: relative;\r\n  z-index: 1;\r\n  border: none !important;\r\n  overflow: visible !important;\r\n  isolation: isolate;\r\n  background: transparent !important;\r\n  color: var(--card-c1) !important;\r\n  transition: transform 280ms ease, border-radius 280ms ease, color 280ms ease;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-icon-wrap::before {\r\n  content: \"\";\r\n  position: absolute;\r\n  inset: 0;\r\n  border-radius: 22px;\r\n  background:\r\n    linear-gradient(145deg, rgba(255,255,255,0.96), var(--card-soft)),\r\n    radial-gradient(circle at 24% 18%, rgba(255,255,255,1), transparent 42%);\r\n  border: 1px solid rgba(255,255,255,0.76);\r\n  box-shadow:\r\n    inset 0 1px 0 rgba(255,255,255,0.96),\r\n    0 12px 26px rgba(15, 23, 42, 0.08),\r\n    0 0 0 6px rgba(15, 23, 42, 0.035);\r\n  z-index: 1;\r\n  transition: transform 280ms ease, border-radius 280ms ease, background 280ms ease, box-shadow 280ms ease;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-icon-wrap::after {\r\n  display: none !important;\r\n  content: none !important;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-icon-wrap i {\r\n  font-size: 26px !important;\r\n  line-height: 1 !important;\r\n  display: inline-block !important;\r\n  position: relative;\r\n  z-index: 3;\r\n  color: var(--card-c1) !important;\r\n  -webkit-text-fill-color: var(--card-c1) !important;\r\n  background: none !important;\r\n  filter: none !important;\r\n  transition: transform 280ms ease, color 280ms ease, -webkit-text-fill-color 280ms ease;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-card-title {\r\n  margin: 0 0 11px 0 !important;\r\n  padding: 0 !important;\r\n  position: relative;\r\n  z-index: 1;\r\n  font-family: var(--fg-font) !important;\r\n  font-size: 18.5px !important;\r\n  font-weight: 620 !important;\r\n  line-height: 1.35 !important;\r\n  letter-spacing: -0.01em !important;\r\n  color: #10201f !important;\r\n  transition: color 260ms ease, transform 260ms ease;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-card-title::after {\r\n  content: \"\";\r\n  display: block;\r\n  width: 0;\r\n  height: 2px;\r\n  margin-top: 9px;\r\n  border-radius: 20px;\r\n  background: linear-gradient(90deg, var(--card-c1), var(--card-c2));\r\n  transition: width 300ms ease;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-card-text {\r\n  margin: 0 !important;\r\n  padding: 0 !important;\r\n  position: relative;\r\n  z-index: 1;\r\n  font-family: var(--fg-font) !important;\r\n  font-size: 15px !important;\r\n  font-weight: 400 !important;\r\n  line-height: 1.72 !important;\r\n  color: var(--fg-muted) !important;\r\n  flex: 1 1 auto;\r\n  transition: transform 260ms ease, color 260ms ease;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-one .fgblackletterfontgenerator-feature-card:hover {\r\n  transform: translateY(-8px) translateX(5px) rotate(-0.7deg);\r\n  background:\r\n    radial-gradient(circle at 92% 18%, var(--card-glow), transparent 28%),\r\n    linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,0.96)) !important;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-one .fgblackletterfontgenerator-feature-card:hover::after {\r\n  width: 62px;\r\n  opacity: 1;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-one .fgblackletterfontgenerator-feature-card:hover .fgblackletterfontgenerator-icon-wrap {\r\n  transform: translateY(-7px) translateX(5px) rotate(-5deg) scale(1.06);\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-one .fgblackletterfontgenerator-feature-card:hover .fgblackletterfontgenerator-icon-wrap::before {\r\n  border-radius: 28px 16px 28px 16px;\r\n  background: linear-gradient(145deg, var(--card-c1), var(--card-c2)) !important;\r\n  box-shadow:\r\n    0 16px 34px var(--card-glow),\r\n    0 0 0 6px rgba(15, 23, 42, 0.06),\r\n    inset 0 1px 0 rgba(255,255,255,0.28) !important;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-one .fgblackletterfontgenerator-feature-card:hover .fgblackletterfontgenerator-icon-wrap i {\r\n  color: #ffffff !important;\r\n  -webkit-text-fill-color: #ffffff !important;\r\n  transform: scale(1.12) rotate(5deg);\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-one .fgblackletterfontgenerator-feature-card:hover .fgblackletterfontgenerator-card-title {\r\n  color: var(--card-c1) !important;\r\n  transform: translateX(5px);\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-one .fgblackletterfontgenerator-feature-card:hover .fgblackletterfontgenerator-card-title::after {\r\n  width: 50px;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-one .fgblackletterfontgenerator-feature-card:hover .fgblackletterfontgenerator-card-text {\r\n  transform: translateX(5px);\r\n  color: #4d6262 !important;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-two .fgblackletterfontgenerator-feature-card {\r\n  transform-style: preserve-3d;\r\n  perspective: 900px;\r\n  border: 1.5px solid rgba(255, 255, 255, 0.45) !important;\r\n  background:\r\n    radial-gradient(circle at var(--fg-mx) var(--fg-my), rgba(255,255,255,0.58), transparent 36%),\r\n    linear-gradient(180deg, rgba(255,255,255,0.96), rgba(255,255,255,0.88)) !important;\r\n  backdrop-filter: blur(10px);\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-two .fgblackletterfontgenerator-feature-card::after {\r\n  left: 50%;\r\n  bottom: auto;\r\n  top: 0;\r\n  width: 0;\r\n  height: 4px;\r\n  transform: translateX(-50%);\r\n  opacity: 0;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-two .fgblackletterfontgenerator-feature-card:hover {\r\n  transform: translateY(-9px) rotateX(var(--fg-tilt-y)) rotateY(var(--fg-tilt-x));\r\n  border-color: rgba(255,255,255,0.92) !important;\r\n  box-shadow:\r\n    0 26px 62px rgba(15, 23, 42, 0.18),\r\n    0 0 0 3px rgba(255,255,255,0.22),\r\n    0 0 0 8px rgba(255,255,255,0.10) !important;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-two .fgblackletterfontgenerator-feature-card:hover::after {\r\n  width: calc(100% - 52px);\r\n  opacity: 1;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-two .fgblackletterfontgenerator-feature-card:hover .fgblackletterfontgenerator-icon-wrap {\r\n  transform: translateZ(20px) translateY(-7px) scale(1.07);\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-two .fgblackletterfontgenerator-feature-card:hover .fgblackletterfontgenerator-icon-wrap::before {\r\n  border-radius: 50%;\r\n  background: linear-gradient(145deg, var(--card-c1), var(--card-c2)) !important;\r\n  box-shadow:\r\n    0 16px 36px var(--card-glow),\r\n    0 0 0 7px rgba(255,255,255,0.14),\r\n    inset 0 1px 0 rgba(255,255,255,0.32) !important;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-two .fgblackletterfontgenerator-feature-card:hover .fgblackletterfontgenerator-icon-wrap i {\r\n  color: #ffffff !important;\r\n  -webkit-text-fill-color: #ffffff !important;\r\n  transform: rotateY(180deg) scale(1.1);\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-two .fgblackletterfontgenerator-feature-card:hover .fgblackletterfontgenerator-card-title {\r\n  color: var(--card-c1) !important;\r\n  transform: translateY(-3px);\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-two .fgblackletterfontgenerator-feature-card:hover .fgblackletterfontgenerator-card-title::after {\r\n  width: 52px;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-two .fgblackletterfontgenerator-feature-card:hover .fgblackletterfontgenerator-card-text {\r\n  color: #4d6262 !important;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-three .fgblackletterfontgenerator-feature-card::before {\r\n  width: 120px;\r\n  height: 120px;\r\n  right: 18px;\r\n  top: 18px;\r\n  border-radius: 999px;\r\n  background: radial-gradient(circle, var(--card-glow), transparent 70%);\r\n  opacity: 0;\r\n  transform: scale(0.7);\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-three .fgblackletterfontgenerator-feature-card::after {\r\n  width: 10px;\r\n  height: 10px;\r\n  left: auto;\r\n  right: 24px;\r\n  bottom: 24px;\r\n  border-radius: 999px;\r\n  background: linear-gradient(135deg, var(--card-c1), var(--card-c2));\r\n  opacity: 0;\r\n  transform: scale(0.4);\r\n  box-shadow: 0 0 0 0 var(--card-glow);\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-three .fgblackletterfontgenerator-feature-card:hover {\r\n  transform: translateY(-7px) scale(1.012) !important;\r\n  border-color: rgba(15, 23, 42, 0.16) !important;\r\n  box-shadow: 0 24px 58px var(--card-glow) !important;\r\n  background:\r\n    radial-gradient(circle at 88% 18%, var(--card-glow), transparent 28%),\r\n    linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,0.96)) !important;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-three .fgblackletterfontgenerator-feature-card:hover::before {\r\n  opacity: 1 !important;\r\n  transform: scale(1) !important;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-three .fgblackletterfontgenerator-feature-card:hover::after {\r\n  opacity: 1 !important;\r\n  transform: scale(1) !important;\r\n  box-shadow: 0 0 0 8px rgba(15, 23, 42, 0.035) !important;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-three .fgblackletterfontgenerator-feature-card:hover .fgblackletterfontgenerator-icon-wrap {\r\n  transform: translateY(-8px) scale(1.065) !important;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-three .fgblackletterfontgenerator-feature-card:hover .fgblackletterfontgenerator-icon-wrap::before {\r\n  border-radius: 50% !important;\r\n  background:\r\n    linear-gradient(145deg, rgba(255,255,255,0.96), var(--card-soft)),\r\n    radial-gradient(circle at 24% 18%, rgba(255,255,255,1), transparent 42%) !important;\r\n  box-shadow:\r\n    inset 0 1px 0 rgba(255,255,255,0.96),\r\n    0 14px 30px var(--card-glow),\r\n    0 0 0 6px rgba(15, 23, 42, 0.035) !important;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-three .fgblackletterfontgenerator-feature-card:hover .fgblackletterfontgenerator-icon-wrap i {\r\n  color: var(--card-c1) !important;\r\n  -webkit-text-fill-color: var(--card-c1) !important;\r\n  transform: translateY(-1px) scale(1.12) rotate(5deg) !important;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-three .fgblackletterfontgenerator-feature-card:hover .fgblackletterfontgenerator-card-title {\r\n  color: var(--card-c1) !important;\r\n  transform: translateY(-3px) !important;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-three .fgblackletterfontgenerator-feature-card:hover .fgblackletterfontgenerator-card-title::after {\r\n  width: 56px !important;\r\n}\r\n\r\n.fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-interaction-three .fgblackletterfontgenerator-feature-card:hover .fgblackletterfontgenerator-card-text {\r\n  transform: translateY(-2px) !important;\r\n  color: #4d6262 !important;\r\n}\r\n\r\n@media (max-width: 1100px) {\r\n  .fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-second-grid {\r\n    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;\r\n  }\r\n}\r\n\r\n@media (max-width: 980px) {\r\n  .fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-content-section {\r\n    padding: 64px 18px;\r\n  }\r\n\r\n  .fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-card-grid {\r\n    grid-template-columns: repeat(2, minmax(0, 1fr));\r\n  }\r\n}\r\n\r\n@media (max-width: 640px) {\r\n  .fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-content-section {\r\n    padding: 52px 16px;\r\n  }\r\n\r\n  .fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-section-heading-wrap {\r\n    margin-bottom: 28px;\r\n  }\r\n\r\n  .fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-card-grid,\r\n  .fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-second-grid {\r\n    grid-template-columns: 1fr !important;\r\n    gap: 18px;\r\n  }\r\n\r\n  .fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-feature-card {\r\n    padding: 24px;\r\n    border-radius: 20px;\r\n  }\r\n\r\n  .fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-icon-wrap {\r\n    width: 60px !important;\r\n    height: 60px !important;\r\n    min-width: 60px !important;\r\n    min-height: 60px !important;\r\n    border-radius: 20px !important;\r\n    margin-bottom: 18px !important;\r\n  }\r\n\r\n  .fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-icon-wrap::before {\r\n    border-radius: 20px !important;\r\n  }\r\n\r\n  .fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-icon-wrap i {\r\n    font-size: 21px !important;\r\n  }\r\n\r\n  .fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-card-title {\r\n    font-size: 18px !important;\r\n  }\r\n\r\n  .fgblackletterfontgenerator-content-wrapper .fgblackletterfontgenerator-card-text {\r\n    font-size: 15px !important;\r\n  }\r\n}\r\n<\/style>\r\n\t\r\n\t<section class=\"fgblackletterfontgenerator-content-section fgblackletterfontgenerator-section-white fgblackletterfontgenerator-interaction-one\">\r\n\t\t<div class=\"fgblackletterfontgenerator-inner-container\">\r\n\t\t\t\t\r\n\t\t<\/div>\r\n\t<\/section>\r\n\r\n<section class=\"fgblackletterfontgenerator-content-section fgblackletterfontgenerator-section-white fgblackletterfontgenerator-interaction-one\">\r\n<div class=\"fgblackletterfontgenerator-inner-container\">\r\n\r\n<div class=\"fgblackletterfontgenerator-section-heading-wrap\">\r\n<h2 class=\"fgblackletterfontgenerator-section-title\">What Is a <span class=\"fgblackletterfontgenerator-keyword-gradient\">Blackletter Font Generator<\/span>?<\/h2>\r\n<h3 class=\"fgblackletterfontgenerator-section-subtitle\">A Blackletter Font Generator turns normal text into gothic, medieval, sharp, and dramatic font styles for bios, captions, names, posts, profiles, and creative designs.<\/h3>\r\n<\/div>\r\n\r\n<div class=\"fgblackletterfontgenerator-card-grid\">\r\n\r\n<article class=\"fgblackletterfontgenerator-feature-card\">\r\n<div class=\"fgblackletterfontgenerator-icon-wrap\">\r\n<i class=\"fa-solid fa-book\"><\/i>\r\n<\/div>\r\n<h4 class=\"fgblackletterfontgenerator-card-title\">Blackletter Style Output<\/h4>\r\n<p class=\"fgblackletterfontgenerator-card-text\">A Blackletter Font Generator converts plain words into gothic, medieval, sharp, and dramatic text that feels more unique, expressive, and useful for creative pages.<\/p>\r\n<\/article>\r\n\r\n<article class=\"fgblackletterfontgenerator-feature-card\">\r\n<div class=\"fgblackletterfontgenerator-icon-wrap\">\r\n<i class=\"fa-solid fa-swatchbook\"><\/i>\r\n<\/div>\r\n<h4 class=\"fgblackletterfontgenerator-card-title\">Creative Font Variations<\/h4>\r\n<p class=\"fgblackletterfontgenerator-card-text\">Users can explore different blackletter looks for names, captions, headings, bios, comments, and short social posts.<\/p>\r\n<\/article>\r\n\r\n<article class=\"fgblackletterfontgenerator-feature-card\">\r\n<div class=\"fgblackletterfontgenerator-icon-wrap\">\r\n<i class=\"fa-solid fa-bezier-curve\"><\/i>\r\n<\/div>\r\n<h4 class=\"fgblackletterfontgenerator-card-title\">Decorative Letter Style<\/h4>\r\n<p class=\"fgblackletterfontgenerator-card-text\">The generated output helps normal letters feel more visual, polished, and memorable without manual design work.<\/p>\r\n<\/article>\r\n\r\n<article class=\"fgblackletterfontgenerator-feature-card\">\r\n<div class=\"fgblackletterfontgenerator-icon-wrap\">\r\n<i class=\"fa-solid fa-i-cursor\"><\/i>\r\n<\/div>\r\n<h4 class=\"fgblackletterfontgenerator-card-title\">Simple Text Input<\/h4>\r\n<p class=\"fgblackletterfontgenerator-card-text\">Users only need to type or paste normal text, and the tool instantly creates blackletter-style font versions.<\/p>\r\n<\/article>\r\n\r\n<article class=\"fgblackletterfontgenerator-feature-card\">\r\n<div class=\"fgblackletterfontgenerator-icon-wrap\">\r\n<i class=\"fa-solid fa-clipboard\"><\/i>\r\n<\/div>\r\n<h4 class=\"fgblackletterfontgenerator-card-title\">Copy and Paste Ready<\/h4>\r\n<p class=\"fgblackletterfontgenerator-card-text\">Generated font styles can be copied quickly and pasted into social media, messaging apps, profiles, or content editors.<\/p>\r\n<\/article>\r\n\r\n<article class=\"fgblackletterfontgenerator-feature-card\">\r\n<div class=\"fgblackletterfontgenerator-icon-wrap\">\r\n<i class=\"fa-solid fa-layer-group\"><\/i>\r\n<\/div>\r\n<h4 class=\"fgblackletterfontgenerator-card-title\">Multiple Style Choices<\/h4>\r\n<p class=\"fgblackletterfontgenerator-card-text\">A good generator gives users multiple options so they can match the style with their mood, brand, profile, or design idea.<\/p>\r\n<\/article>\r\n\r\n<\/div>\r\n<\/div>\r\n<\/section>\r\n\r\n<section class=\"fgblackletterfontgenerator-content-section fgblackletterfontgenerator-section-soft fgblackletterfontgenerator-interaction-two\">\r\n<div class=\"fgblackletterfontgenerator-inner-container\">\r\n\r\n<div class=\"fgblackletterfontgenerator-section-heading-wrap\">\r\n<h2 class=\"fgblackletterfontgenerator-section-title\">Why Use a <span class=\"fgblackletterfontgenerator-keyword-gradient\">Blackletter Font Generator<\/span>?<\/h2>\r\n<h3 class=\"fgblackletterfontgenerator-section-subtitle\">It helps users create attractive styled text without design software, font downloads, or manually searching for special characters.<\/h3>\r\n<\/div>\r\n\r\n<div class=\"fgblackletterfontgenerator-card-grid fgblackletterfontgenerator-second-grid\">\r\n\r\n<article class=\"fgblackletterfontgenerator-feature-card\">\r\n<div class=\"fgblackletterfontgenerator-icon-wrap\">\r\n<i class=\"fa-solid fa-bolt-lightning\"><\/i>\r\n<\/div>\r\n<h4 class=\"fgblackletterfontgenerator-card-title\">Fast Style Creation<\/h4>\r\n<p class=\"fgblackletterfontgenerator-card-text\">Users can create blackletter-style fonts quickly instead of designing each letter or searching for special characters manually.<\/p>\r\n<\/article>\r\n\r\n<article class=\"fgblackletterfontgenerator-feature-card\">\r\n<div class=\"fgblackletterfontgenerator-icon-wrap\">\r\n<i class=\"fa-solid fa-star\"><\/i>\r\n<\/div>\r\n<h4 class=\"fgblackletterfontgenerator-card-title\">Better Visual Appeal<\/h4>\r\n<p class=\"fgblackletterfontgenerator-card-text\">Styled text helps plain words stand out with a stronger mood, better personality, and more attractive presentation.<\/p>\r\n<\/article>\r\n\r\n<article class=\"fgblackletterfontgenerator-feature-card\">\r\n<div class=\"fgblackletterfontgenerator-icon-wrap\">\r\n<i class=\"fa-solid fa-mobile-screen-button\"><\/i>\r\n<\/div>\r\n<h4 class=\"fgblackletterfontgenerator-card-title\">Social Media Friendly<\/h4>\r\n<p class=\"fgblackletterfontgenerator-card-text\">The generated styles can be used on Instagram, TikTok, Facebook, Discord, WhatsApp, and other popular platforms.<\/p>\r\n<\/article>\r\n\r\n<article class=\"fgblackletterfontgenerator-feature-card\">\r\n<div class=\"fgblackletterfontgenerator-icon-wrap\">\r\n<i class=\"fa-solid fa-gem\"><\/i>\r\n<\/div>\r\n<h4 class=\"fgblackletterfontgenerator-card-title\">Personal Expression<\/h4>\r\n<p class=\"fgblackletterfontgenerator-card-text\">It helps users express a theme, mood, fandom, aesthetic, or creative personality through simple text styling.<\/p>\r\n<\/article>\r\n\r\n<article class=\"fgblackletterfontgenerator-feature-card\">\r\n<div class=\"fgblackletterfontgenerator-icon-wrap\">\r\n<i class=\"fa-solid fa-shapes\"><\/i>\r\n<\/div>\r\n<h4 class=\"fgblackletterfontgenerator-card-title\">Symbol Decoration<\/h4>\r\n<p class=\"fgblackletterfontgenerator-card-text\">Many styles include decorative symbols, spacing effects, and special characters for a more polished visual result.<\/p>\r\n<\/article>\r\n\r\n<article class=\"fgblackletterfontgenerator-feature-card\">\r\n<div class=\"fgblackletterfontgenerator-icon-wrap\">\r\n<i class=\"fa-solid fa-id-badge\"><\/i>\r\n<\/div>\r\n<h4 class=\"fgblackletterfontgenerator-card-title\">Username Ideas<\/h4>\r\n<p class=\"fgblackletterfontgenerator-card-text\">Generated styles can make usernames, display names, nicknames, and profile headings look more unique and memorable.<\/p>\r\n<\/article>\r\n\r\n<article class=\"fgblackletterfontgenerator-feature-card\">\r\n<div class=\"fgblackletterfontgenerator-icon-wrap\">\r\n<i class=\"fa-solid fa-comments\"><\/i>\r\n<\/div>\r\n<h4 class=\"fgblackletterfontgenerator-card-title\">Caption Styling<\/h4>\r\n<p class=\"fgblackletterfontgenerator-card-text\">Stylish text can improve captions, comments, quotes, and status updates by making them more expressive and eye-catching.<\/p>\r\n<\/article>\r\n\r\n<article class=\"fgblackletterfontgenerator-feature-card\">\r\n<div class=\"fgblackletterfontgenerator-icon-wrap\">\r\n<i class=\"fa-solid fa-border-all\"><\/i>\r\n<\/div>\r\n<h4 class=\"fgblackletterfontgenerator-card-title\">Multiple Options<\/h4>\r\n<p class=\"fgblackletterfontgenerator-card-text\">A useful generator shows several variations at once so users can compare, copy, and test the best-looking version.<\/p>\r\n<\/article>\r\n\r\n<\/div>\r\n<\/div>\r\n<\/section>\r\n\r\n<section class=\"fgblackletterfontgenerator-content-section fgblackletterfontgenerator-section-white fgblackletterfontgenerator-interaction-three\">\r\n<div class=\"fgblackletterfontgenerator-inner-container\">\r\n\r\n<div class=\"fgblackletterfontgenerator-section-heading-wrap\">\r\n<h2 class=\"fgblackletterfontgenerator-section-title\">How to Use a <span class=\"fgblackletterfontgenerator-keyword-gradient\">Blackletter Font Generator<\/span>?<\/h2>\r\n<h3 class=\"fgblackletterfontgenerator-section-subtitle\">Type your text, choose a font style, preview the output, copy your favorite version, and paste it wherever you want.<\/h3>\r\n<\/div>\r\n\r\n<div class=\"fgblackletterfontgenerator-card-grid\">\r\n\r\n<article class=\"fgblackletterfontgenerator-feature-card\">\r\n<div class=\"fgblackletterfontgenerator-icon-wrap\">\r\n<i class=\"fa-solid fa-pen-to-square\"><\/i>\r\n<\/div>\r\n<h4 class=\"fgblackletterfontgenerator-card-title\">Enter Your Text<\/h4>\r\n<p class=\"fgblackletterfontgenerator-card-text\">Start by typing a name, phrase, caption, quote, username, message, or short line that you want to style.<\/p>\r\n<\/article>\r\n\r\n<article class=\"fgblackletterfontgenerator-feature-card\">\r\n<div class=\"fgblackletterfontgenerator-icon-wrap\">\r\n<i class=\"fa-solid fa-list-check\"><\/i>\r\n<\/div>\r\n<h4 class=\"fgblackletterfontgenerator-card-title\">Choose a Font Style<\/h4>\r\n<p class=\"fgblackletterfontgenerator-card-text\">Look through the generated font styles and choose the version that best matches your profile, post, or design idea.<\/p>\r\n<\/article>\r\n\r\n<article class=\"fgblackletterfontgenerator-feature-card\">\r\n<div class=\"fgblackletterfontgenerator-icon-wrap\">\r\n<i class=\"fa-solid fa-magnifying-glass\"><\/i>\r\n<\/div>\r\n<h4 class=\"fgblackletterfontgenerator-card-title\">Preview the Result<\/h4>\r\n<p class=\"fgblackletterfontgenerator-card-text\">Check how the font looks before using it, especially when the output includes symbols, spacing, or fancy characters.<\/p>\r\n<\/article>\r\n\r\n<article class=\"fgblackletterfontgenerator-feature-card\">\r\n<div class=\"fgblackletterfontgenerator-icon-wrap\">\r\n<i class=\"fa-solid fa-paste\"><\/i>\r\n<\/div>\r\n<h4 class=\"fgblackletterfontgenerator-card-title\">Copy the Text<\/h4>\r\n<p class=\"fgblackletterfontgenerator-card-text\">Use the copy option to grab the selected font style without manually highlighting or retyping the output.<\/p>\r\n<\/article>\r\n\r\n<article class=\"fgblackletterfontgenerator-feature-card\">\r\n<div class=\"fgblackletterfontgenerator-icon-wrap\">\r\n<i class=\"fa-solid fa-share-from-square\"><\/i>\r\n<\/div>\r\n<h4 class=\"fgblackletterfontgenerator-card-title\">Paste Anywhere<\/h4>\r\n<p class=\"fgblackletterfontgenerator-card-text\">Paste the styled text into bios, comments, captions, usernames, posts, messages, or design tools.<\/p>\r\n<\/article>\r\n\r\n<article class=\"fgblackletterfontgenerator-feature-card\">\r\n<div class=\"fgblackletterfontgenerator-icon-wrap\">\r\n<i class=\"fa-solid fa-repeat\"><\/i>\r\n<\/div>\r\n<h4 class=\"fgblackletterfontgenerator-card-title\">Try More Styles<\/h4>\r\n<p class=\"fgblackletterfontgenerator-card-text\">Try different text lengths, styles, and symbols until the final version feels clear, attractive, and ready to use.<\/p>\r\n<\/article>\r\n\r\n<\/div>\r\n<\/div>\r\n<\/section>\r\n\r\n<script>\r\n(function () {\r\n  var wrapper = document.querySelector(\".fgblackletterfontgenerator-content-wrapper\");\r\n  if (!wrapper) { return; }\r\n\r\n  var cards = wrapper.querySelectorAll(\".fgblackletterfontgenerator-feature-card\");\r\n\r\n  if (\"IntersectionObserver\" in window) {\r\n    var observer = new IntersectionObserver(function (entries) {\r\n      entries.forEach(function (entry) {\r\n        if (entry.isIntersecting) {\r\n          entry.target.classList.add(\"fgblackletterfontgenerator-card-visible\");\r\n          observer.unobserve(entry.target);\r\n        }\r\n      });\r\n    }, { threshold: 0.16 });\r\n\r\n    cards.forEach(function (card, index) {\r\n      card.style.transitionDelay = (index % 8) * 45 + \"ms\";\r\n      observer.observe(card);\r\n    });\r\n  } else {\r\n    cards.forEach(function (card) {\r\n      card.classList.add(\"fgblackletterfontgenerator-card-visible\");\r\n    });\r\n  }\r\n\r\n  cards.forEach(function (card) {\r\n    card.addEventListener(\"mousemove\", function (event) {\r\n      var rect = card.getBoundingClientRect();\r\n      var x = ((event.clientX - rect.left) \/ rect.width) * 100;\r\n      var y = ((event.clientY - rect.top) \/ rect.height) * 100;\r\n      var tiltX = ((x - 50) \/ 50) * 2.4;\r\n      var tiltY = ((50 - y) \/ 50) * 2.4;\r\n      card.style.setProperty(\"--fg-mx\", x.toFixed(2) + \"%\");\r\n      card.style.setProperty(\"--fg-my\", y.toFixed(2) + \"%\");\r\n      card.style.setProperty(\"--fg-tilt-x\", tiltX.toFixed(2) + \"deg\");\r\n      card.style.setProperty(\"--fg-tilt-y\", tiltY.toFixed(2) + \"deg\");\r\n    });\r\n\r\n    card.addEventListener(\"mouseleave\", function () {\r\n      card.style.setProperty(\"--fg-mx\", \"50%\");\r\n      card.style.setProperty(\"--fg-my\", \"18%\");\r\n      card.style.setProperty(\"--fg-tilt-x\", \"0deg\");\r\n      card.style.setProperty(\"--fg-tilt-y\", \"0deg\");\r\n    });\r\n  });\r\n})();\r\n<\/script>\r\n\r\n<\/div><\/div>\n\t\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":"","protected":false},"author":3,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"template-homepage.php","meta":{"footnotes":""},"class_list":["post-5640","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/fonttor.com\/wp-json\/wp\/v2\/pages\/5640","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fonttor.com\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/fonttor.com\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/fonttor.com\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/fonttor.com\/wp-json\/wp\/v2\/comments?post=5640"}],"version-history":[{"count":4,"href":"https:\/\/fonttor.com\/wp-json\/wp\/v2\/pages\/5640\/revisions"}],"predecessor-version":[{"id":5644,"href":"https:\/\/fonttor.com\/wp-json\/wp\/v2\/pages\/5640\/revisions\/5644"}],"wp:attachment":[{"href":"https:\/\/fonttor.com\/wp-json\/wp\/v2\/media?parent=5640"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}