{"id":5871,"date":"2026-06-06T05:28:54","date_gmt":"2026-06-06T05:28:54","guid":{"rendered":"https:\/\/fontono.com\/mario\/"},"modified":"2026-06-06T05:28:54","modified_gmt":"2026-06-06T05:28:54","slug":"mario","status":"publish","type":"page","link":"https:\/\/fontono.com\/mario\/","title":{"rendered":"Mario Font Generator \u2013 Classic &#038; Fun Text Styles"},"content":{"rendered":"<style type=\"text\/css\">\n.tc-wp-island {\n  width: 100%;\n  max-width: 100%;\n  min-width: 0;\n  box-sizing: border-box;\n  display: flow-root;\n  isolation: isolate;\n  position: relative;\n}\n.tc-wp-island > * {\n  min-width: 0;\n}\n.tc-wp-island *,\n.tc-wp-island *::before,\n.tc-wp-island *::after {\n  box-sizing: border-box;\n}\n.tc-wp-island img,\n.tc-wp-island video,\n.tc-wp-island svg,\n.tc-wp-island iframe {\n  max-width: 100%;\n  height: auto;\n}\n.tc-wp-island .tc-wp-tool {\n  max-width: 100%;\n  min-width: 0;\n}\n.tc-wp-island .tc-wp-tool-html,\n.tc-wp-island .tc-wp-tool-content,\n.tc-wp-island .tc-wp-other {\n  max-width: 100%;\n  min-width: 0;\n  overflow-wrap: anywhere;\n  word-break: break-word;\n}\n\/* Keep tool in post content flow \u2014 not overlapping theme header \/ hero band *\/\n.tc-wp-island {\n  clear: both;\n  z-index: 1;\n}\n.tc-wp-island .tc-wp-tool {\n  position: relative;\n  z-index: 0;\n  clear: both;\n  margin-top: 0;\n  margin-bottom: 1.25rem;\n}\n.tc-wp-island .tc-wp-tool-html {\n  position: relative;\n  z-index: 0;\n  clear: both;\n  contain: layout;\n}\n.tc-wp-island .tc-wp-tool-html > *:first-child {\n  position: relative !important;\n  top: auto !important;\n  left: auto !important;\n  right: auto !important;\n  margin-top: 0 !important;\n  width: 100%;\n  max-width: 100%;\n  box-sizing: border-box;\n}\nbody:has(.tc-wp-island) #main-header,\nbody:has(.tc-wp-island) header.site-header,\nbody:has(.tc-wp-island) .site-header,\nbody:has(.tc-wp-island) #header,\nbody:has(.tc-wp-island) .et-fixed-header,\nbody:has(.tc-wp-island) .elementor-location-header {\n  z-index: 200;\n}\n\/* Space between WP Coder tool + content shortcodes on publish\/draft pages *\/\n.tc-wp-island .tc-wp-tool-html + .tc-wp-tool-content {\n  margin-top: 20px;\n}\n.tc-wp-island .tc-wp-bcd-codes {\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n}\n\/* Full-width: hide theme sidebar when a ToolsChecker island is present *\/\nbody:has(.tc-wp-island) #sidebar,\nbody:has(.tc-wp-island) .sidebar,\nbody:has(.tc-wp-island) #secondary,\nbody:has(.tc-wp-island) .widget-area,\nbody:has(.tc-wp-island) aside.sidebar,\nbody:has(.tc-wp-island) #right-sidebar,\nbody:has(.tc-wp-island) #left-sidebar,\nbody:has(.tc-wp-island) .sidebar-primary,\nbody:has(.tc-wp-island) .sidebar-secondary,\nbody:has(.tc-wp-island) .ast-sidebar,\nbody:has(.tc-wp-island) .site-sidebar {\n  display: none !important;\n}\n\/* Copygen: hide default page title\/breadcrumb band \u2014 tool pages use template-homepage like category *\/\nbody:has(.tc-wp-island) section.page_header_default,\nbody:has(.tc-wp-island) .page_header_default {\n  display: none !important;\n}\n@media (min-width: 981px) {\n  body:has(.tc-wp-island) #left-area,\n  body:has(.tc-wp-island) #primary,\n  body:has(.tc-wp-island) #content-area,\n  body:has(.tc-wp-island) #content-area .container,\n  body:has(.tc-wp-island) .content-area,\n  body:has(.tc-wp-island) main.site-main,\n  body:has(.tc-wp-island) .site-content .content-area {\n    width: 100% !important;\n    max-width: 100% !important;\n    float: none !important;\n    padding-right: 0 !important;\n    padding-left: 0 !important;\n  }\n  body:has(.tc-wp-island) #main-content .container:before {\n    display: none !important;\n  }\n}\n\/* Tool pages: keep theme H1 readable \u2014 smaller type, full content width, 1\u20132 lines *\/\nbody:has(.tc-wp-island) .fontib-v2-hero-inner {\n  width: min(100%, calc(100vw - 40px)) !important;\n  max-width: 1320px !important;\n}\nbody:has(.tc-wp-island) .fontib-v2-title,\nbody:has(.tc-wp-island) #left-area > .entry-title,\nbody:has(.tc-wp-island) .entry-title h1,\nbody:has(.tc-wp-island) h1.entry-title,\nbody:has(.tc-wp-island) .page-title,\nbody:has(.tc-wp-island) .et_pb_title_container h1 {\n  max-width: 100% !important;\n  width: 100%;\n  font-size: clamp(24px, 2.6vw, 38px) !important;\n  line-height: 1.2 !important;\n  letter-spacing: -0.01em;\n}\n<\/style>\n<div class=\"tc-wp-island\">\n<section class=\"tc-wp-tool\" data-tool-index=\"1\">\n<div class=\"tc-wp-tool-html\"><!-- --- START OF MARIO FONT GENERATOR --- -->\r\n\r\n<div id=\"mario-font-generator\">\r\n    <style>\r\n        @import url('https:\/\/fonts.googleapis.com\/css2?family=Fredoka:wght@700&family=Press+Start+2P&display=swap');\r\n\r\n        #mario-font-generator {\r\n            font-family: 'Fredoka', sans-serif;\r\n            background: linear-gradient(180deg, #5c94fc 0%, #a2c1fe 50%, #e0f8cf 100%);\r\n            width: 100%;\r\n            padding: 3rem 1rem;\r\n            box-sizing: border-box;\r\n            color: #333;\r\n            min-height: 100vh;\r\n            --m-red: #e52521;\r\n            --m-yellow: #fbd000;\r\n            --m-green: #43b047;\r\n            --m-blue: #049cd8;\r\n            --m-brown: #8a4500;\r\n            --m-white: #ffffff;\r\n            --m-border: 4px solid var(--m-brown);\r\n        }\r\n\r\n        #mario-font-generator * { box-sizing: border-box; }\r\n\r\n        .m-container {\r\n            width: 100%;\r\n            max-width: 1200px;\r\n            margin: 0 auto;\r\n        }\r\n\r\n        .m-header { text-align: center; margin-bottom: 3rem; }\r\n\r\n        .m-main-title {\r\n            font-family: 'Fredoka', sans-serif;\r\n            font-size: clamp(1.5rem, 5vw, 2.8rem);\r\n            color: var(--m-white);\r\n            text-shadow: 3px 3px 0px var(--m-red), -2px -2px 0px var(--m-blue), 3px -1px 0px var(--m-green), 6px 6px 0px rgba(0,0,0,0.1);\r\n            margin: 0;\r\n            -webkit-text-stroke: 1.5px var(--m-brown);\r\n        }\r\n\r\n        \/* Input Card *\/\r\n        .m-input-box {\r\n            background: var(--m-white);\r\n            padding: 2rem;\r\n            border-radius: 20px;\r\n            border: var(--m-border);\r\n            box-shadow: 0 8px 0px var(--m-brown);\r\n            margin-bottom: 3rem;\r\n            position: relative;\r\n        }\r\n\r\n        .m-textarea {\r\n            width: 100%;\r\n            border: 4px solid #eee;\r\n            border-radius: 12px;\r\n            padding: 1.2rem;\r\n            font-size: 1.4rem;\r\n            font-family: 'Fredoka', sans-serif;\r\n            color: var(--m-brown);\r\n            outline: none;\r\n            background: #fffdf0;\r\n            min-height: 100px;\r\n        }\r\n\r\n        .m-controls {\r\n            display: flex;\r\n            justify-content: space-between;\r\n            align-items: center;\r\n            margin-top: 1.5rem;\r\n            flex-wrap: wrap;\r\n            gap: 15px;\r\n        }\r\n\r\n        .m-btn-group { display: flex; gap: 10px; }\r\n\r\n        .m-btn {\r\n            border: 3px solid var(--m-brown);\r\n            padding: 0.8rem 1.4rem;\r\n            font-weight: 700;\r\n            text-transform: uppercase;\r\n            cursor: pointer;\r\n            border-radius: 10px;\r\n            transition: 0.1s;\r\n        }\r\n\r\n        .m-btn-red { background: var(--m-red); color: white; box-shadow: 0 4px 0px #9a1a17; }\r\n        .m-btn-green { background: var(--m-green); color: white; box-shadow: 0 4px 0px #2d7a31; }\r\n        .m-btn:active { transform: translateY(3px); box-shadow: 0 1px 0px rgba(0,0,0,0.5); }\r\n\r\n        \/* Output Grid *\/\r\n        .m-grid {\r\n            display: grid;\r\n            grid-template-columns: repeat(4, 1fr);\r\n            gap: 1.5rem;\r\n        }\r\n\r\n        .m-card {\r\n            background: var(--m-white);\r\n            border: var(--m-border);\r\n            border-radius: 15px;\r\n            height: 250px;\r\n            max-height: 250px;\r\n            display: flex;\r\n            flex-direction: column;\r\n            overflow: hidden;\r\n            box-shadow: 0 5px 0px rgba(0,0,0,0.1);\r\n        }\r\n\r\n        .m-card-header {\r\n            position: sticky;\r\n            top: 0;\r\n            z-index: 10;\r\n            background: var(--m-blue);\r\n            color: var(--m-white);\r\n            padding: 10px 15px;\r\n            font-size: 0.75rem;\r\n            display: flex;\r\n            justify-content: space-between;\r\n            align-items: center;\r\n            border-bottom: var(--m-border);\r\n            flex-shrink: 0;\r\n            text-transform: uppercase;\r\n        }\r\n\r\n        .m-copy-btn {\r\n            padding: 2px !important;\r\n            background: transparent !important;\r\n            border: none !important;\r\n            cursor: pointer !important;\r\n            color: var(--m-yellow) !important;\r\n            border-radius: 4px !important;\r\n            transition: all 0.2s !important;\r\n            display: flex !important;\r\n            align-items: center !important;\r\n            justify-content: center !important;\r\n        }\r\n\r\n        .m-copy-btn:hover {\r\n            padding: 2px !important;\r\n            background: rgba(255, 255, 255, 0.2) !important;\r\n            color: #ffffff !important;\r\n            transform: scale(1.1) !important;\r\n        }\r\n\r\n        .m-icon {\r\n            width: 18px;\r\n            height: 18px;\r\n            fill: currentColor;\r\n        }\r\n\r\n        .m-card-body {\r\n            padding: 1.5rem;\r\n            flex-grow: 1;\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            text-align: center;\r\n            color: #333;\r\n        }\r\n\r\n        .m-scroll-area {\r\n            max-height: 180px;\r\n            overflow-y: auto;\r\n            width: 100%;\r\n            word-break: break-word;\r\n            overflow-wrap: anywhere;\r\n        }\r\n\r\n        .m-scroll-area::-webkit-scrollbar { width: 6px; }\r\n        .m-scroll-area::-webkit-scrollbar-track { background: rgba(0, 0, 0, 0.1); border-radius: 3px; }\r\n        .m-scroll-area::-webkit-scrollbar-thumb { background: var(--m-yellow); border-radius: 3px; }\r\n        .m-scroll-area::-webkit-scrollbar-thumb:hover { background: var(--m-brown); }\r\n\r\n\r\n\r\n        .m-load-container { text-align: center; padding: 4rem 0; }\r\n\r\n        .m-hidden {\r\n            display: none;\r\n        }\r\n\r\n        \/* 320px - 374px *\/\r\n        @media (min-width: 320px) and (max-width: 374px) {\r\n            #mario-font-generator { padding: 1rem 0.5rem; }\r\n            .m-header { margin-bottom: 1.5rem; }\r\n            .m-main-title { font-size: 1.2rem; }\r\n            .m-input-box { padding: 1rem; }\r\n            .m-textarea { padding: 0.7rem; font-size: 1rem; min-height: 80px; }\r\n            .m-btn { padding: 0.5rem 0.8rem; font-size: 0.65rem; }\r\n            .m-grid { grid-template-columns: 1fr !important; gap: 0.8rem; }\r\n            .m-card-body { padding: 0.8rem; font-size: 1rem; }\r\n            .m-load-container { padding: 0 0.5rem 1rem; }\r\n        }\r\n\r\n        \/* 375px - 429px *\/\r\n        @media (min-width: 375px) and (max-width: 429px) {\r\n            #mario-font-generator { padding: 1.2rem 0.6rem; }\r\n            .m-header { margin-bottom: 1.5rem; }\r\n            .m-main-title { font-size: 1.4rem; }\r\n            .m-input-box { padding: 1.2rem; }\r\n            .m-textarea { padding: 0.8rem; font-size: 1.1rem; min-height: 80px; }\r\n            .m-btn { padding: 0.55rem 1rem; font-size: 0.7rem; }\r\n            .m-grid { grid-template-columns: 1fr !important; gap: 1rem; }\r\n            .m-card-body { padding: 1rem; font-size: 1.1rem; }\r\n            .m-load-container { padding: 0 0.6rem 1.2rem; }\r\n        }\r\n\r\n        \/* 430px - 767px *\/\r\n        @media (min-width: 430px) and (max-width: 767px) {\r\n            #mario-font-generator { padding: 1.5rem 0.8rem; }\r\n            .m-main-title { font-size: 1.6rem; }\r\n            .m-input-box { padding: 1.5rem; }\r\n            .m-textarea { padding: 0.9rem; font-size: 1.2rem; min-height: 90px; }\r\n            .m-btn { padding: 0.6rem 1.2rem; font-size: 0.75rem; }\r\n            .m-grid { grid-template-columns: 1fr !important; gap: 1.2rem; }\r\n            .m-card-body { padding: 1.2rem; font-size: 1.2rem; }\r\n            .m-load-container { padding: 0 0.8rem 1.5rem; }\r\n        }\r\n\r\n        \/* 768px - 1023px *\/\r\n        @media (min-width: 768px) and (max-width: 1023px) {\r\n            .m-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 1.2rem; }\r\n            .m-card-body { padding: 1.2rem; font-size: 1.2rem; }\r\n        }\r\n\r\n        \/* 1024px - 1199px *\/\r\n        @media (min-width: 1024px) and (max-width: 1199px) {\r\n            .m-grid { grid-template-columns: repeat(3, 1fr) !important; gap: 1.2rem; }\r\n            .m-card-body { font-size: 1.2rem; }\r\n        }\r\n\r\n        \/* 1200px+ *\/\r\n        @media (min-width: 1200px) {\r\n            .m-grid { grid-template-columns: repeat(4, 1fr); }\r\n        }\r\n    <\/style>\r\n\r\n    <div class=\"m-container\">\r\n        <header class=\"m-header\">\r\n            <h1 class=\"m-main-title\">Mario Font Generator \u2013 Classic & Fun Text Styles<\/h1>\r\n        <\/header>\r\n\r\n        <section class=\"m-input-box\">\r\n            <textarea id=\"m-input-field\" class=\"m-textarea\" placeholder=\"Enter text to Mushroomify...\"><\/textarea>\r\n            <div class=\"m-controls\">\r\n                <span style=\"font-weight:bold\">Coins Collected: <span id=\"m-count\">0<\/span><\/span>\r\n                <div class=\"m-btn-group\">\r\n                    <button id=\"m-reset-btn\" class=\"m-btn m-btn-red\">Reset Game<\/button>\r\n                    <button id=\"m-rand-btn\" class=\"m-btn m-btn-green\">Random Power-up<\/button>\r\n                <\/div>\r\n            <\/div>\r\n        <\/section>\r\n\r\n        <div id=\"m-results\" class=\"m-grid\"><\/div>\r\n\r\n        <div class=\"m-load-container\">\r\n            <button id=\"m-more-btn\" class=\"m-btn m-btn-green\" style=\"padding: 1.5rem 4rem;\">Show More Worlds<\/button>\r\n        <\/div>\r\n    <\/div>\r\n\r\n\r\n\r\n    <script>\r\n        (function() {\r\n            const state = { text: \"Mario\", limit: 20 };\r\n\r\n            const maps = {\r\n                bold: \"\ud835\udc00\ud835\udc01\ud835\udc02\ud835\udc03\ud835\udc04\ud835\udc05\ud835\udc06\ud835\udc07\ud835\udc08\ud835\udc09\ud835\udc0a\ud835\udc0b\ud835\udc0c\ud835\udc0d\ud835\udc0e\ud835\udc0f\ud835\udc10\ud835\udc11\ud835\udc12\ud835\udc13\ud835\udc14\ud835\udc15\ud835\udc16\ud835\udc17\ud835\udc18\ud835\udc19\ud835\udc1a\ud835\udc1b\ud835\udc1c\ud835\udc1d\ud835\udc1e\ud835\udc1f\ud835\udc20\ud835\udc21\ud835\udc22\ud835\udc23\ud835\udc24\ud835\udc25\ud835\udc26\ud835\udc27\ud835\udc28\ud835\udc29\ud835\udc2a\ud835\udc2b\ud835\udc2c\ud835\udc2d\ud835\udc2e\ud835\udc2f\ud835\udc30\ud835\udc31\ud835\udc32\ud835\udc33\",\r\n                mono: \"\ud835\ude70\ud835\ude71\ud835\ude72\ud835\ude73\ud835\ude74\ud835\ude75\ud835\ude76\ud835\ude77\ud835\ude78\ud835\ude79\ud835\ude7a\ud835\ude7b\ud835\ude7c\ud835\ude7d\ud835\ude7e\ud835\ude7f\ud835\ude80\ud835\ude81\ud835\ude82\ud835\ude83\ud835\ude84\ud835\ude85\ud835\ude86\ud835\ude87\ud835\ude88\ud835\ude89\ud835\ude8a\ud835\ude8b\ud835\ude8c\ud835\ude8d\ud835\ude8e\ud835\ude8f\ud835\ude90\ud835\ude91\ud835\ude92\ud835\ude93\ud835\ude94\ud835\ude95\ud835\ude96\ud835\ude97\ud835\ude98\ud835\ude99\ud835\ude9a\ud835\ude9b\ud835\ude9c\ud835\ude9d\ud835\ude9e\ud835\ude9f\ud835\udea0\ud835\udea1\ud835\udea2\ud835\udea3\",\r\n                bubble: \"\u24b6\u24b7\u24b8\u24b9\u24ba\u24bb\u24bc\u24bd\u24be\u24bf\u24c0\u24c1\u24c2\u24c3\u24c4\u24c5\u24c6\u24c7\u24c8\u24c9\u24ca\u24cb\u24cc\u24cd\u24ce\u24cf\u24d0\u24d1\u24d2\u24d3\u24d4\u24d5\u24d6\u24d7\u24d8\u24d9\u24da\u24db\u24dc\u24dd\u24de\u24df\u24e0\u24e1\u24e2\u24e3\u24e4\u24e5\u24e6\u24e7\u24e8\u24e9\",\r\n                square: \"\ud83c\udd30\ud83c\udd31\ud83c\udd32\ud83c\udd33\ud83c\udd34\ud83c\udd35\ud83c\udd36\ud83c\udd37\ud83c\udd38\ud83c\udd39\ud83c\udd3a\ud83c\udd3b\ud83c\udd3c\ud83c\udd3d\ud83c\udd3e\ud83c\udd3f\ud83c\udd40\ud83c\udd41\ud83c\udd42\ud83c\udd43\ud83c\udd44\ud83c\udd45\ud83c\udd46\ud83c\udd47\ud83c\udd48\ud83c\udd49\ud83c\udd30\ud83c\udd31\ud83c\udd32\ud83c\udd33\ud83c\udd34\ud83c\udd35\ud83c\udd36\ud83c\udd37\ud83c\udd38\ud83c\udd39\ud83c\udd3a\ud83c\udd3b\ud83c\udd3c\ud83c\udd3d\ud83c\udd3e\ud83c\udd3f\ud83c\udd40\ud83c\udd41\ud83c\udd42\ud83c\udd43\ud83c\udd05\ud83c\udd46\ud83c\udd47\ud83c\udd48\ud83c\udd49\",\r\n                script: \"\ud835\udc9c\u212c\ud835\udc9e\ud835\udc9f\u2130\u2131\ud835\udca2\u210b\u2110\ud835\udca5\ud835\udca6\u2112\u2133\ud835\udca9\ud835\udcaa\ud835\udcab\ud835\udcac\u211b\ud835\udcae\ud835\udcaf\ud835\udcb0\ud835\udcb1\ud835\udcb2\ud835\udcb3\ud835\udcb4\ud835\udcb5\ud835\udcb6\ud835\udcb7\ud835\udcb8\ud835\udcb9\u212f\ud835\udcbb\u210a\ud835\udcbd\ud835\udcbe\ud835\udcbf\ud835\udcc0\ud835\udcc1\ud835\udcc2\ud835\udcc3\u2134\ud835\udcc5\ud835\udcc6\ud835\udcc7\ud835\udcc8\ud835\udcc9\ud835\udcca\ud835\udccb\ud835\udccc\ud835\udccd\ud835\udcce\ud835\udccf\",\r\n                gothic: \"\ud835\udd04\ud835\udd05\u212d\ud835\udd07\ud835\udd08\ud835\udd09\ud835\udd0a\u210c\u2111\ud835\udd0d\ud835\udd0e\ud835\udd0f\ud835\udd10\ud835\udd11\ud835\udd12\ud835\udd13\ud835\udd14\u211c\ud835\udd16\ud835\udd17\ud835\udd18\ud835\udd19\ud835\udd1a\ud835\udd1b\ud835\udd1c\u2128\ud835\udd1e\ud835\udd1f\ud835\udd20\ud835\udd21\ud835\udd22\ud835\udd23\ud835\udd24\ud835\udd25\ud835\udd26\ud835\udd27\ud835\udd28\ud835\udd29\ud835\udd2a\ud835\udd2b\ud835\udd2c\ud835\udd2d\ud835\udd2e\ud835\udd2f\ud835\udd30\ud835\udd31\ud835\udd32\ud835\udd33\ud835\udd34\ud835\udd35\ud835\udd36\ud835\udd37\"\r\n            };\r\n\r\n            const az = \"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz\";\r\n            function convert(t, m) { return [...t].map(c => { const i = az.indexOf(c); return i !== -1 ? ([...m][i] || c) : c; }).join(''); }\r\n\r\n            const styles = [\r\n                { name: \"Super Star\", gen: t => `\ud83c\udf1f ${t.toUpperCase()} \ud83c\udf1f` },\r\n                { name: \"Super Mushroom\", gen: t => `\ud83c\udf44 ${t} \ud83c\udf44` },\r\n                { name: \"Retro Console\", gen: t => convert(t, maps.mono) },\r\n                { name: \"Block Punch\", gen: t => convert(t, maps.square) },\r\n                { name: \"Bubble Shield\", gen: t => convert(t, maps.bubble) },\r\n                { name: \"Castle script\", gen: t => convert(t, maps.script) },\r\n                { name: \"Boss Fight\", gen: t => convert(t, maps.bold) },\r\n                { name: \"Warp Pipe\", gen: t => `[ ${t.toUpperCase()} ]` },\r\n                { name: \"Fire Flower\", gen: t => `\ud83d\udd25 ${t.toUpperCase()} \ud83d\udd25` },\r\n                { name: \"Ice Flower\", gen: t => `\u2744\ufe0f ${t} \u2744\ufe0f` },\r\n                { name: \"1-Up Green\", gen: t => `\ud83e\udd57 ${t} \ud83e\udd57` },\r\n                { name: \"Coin Box\", gen: t => `\ud83d\udcc0 ${t.toUpperCase()} \ud83d\udcc0` },\r\n                { name: \"Boo Ghost\", gen: t => `${t} \ud83d\udc7b` },\r\n                { name: \"Goomba Stomp\", gen: t => `\ud83d\udc5e ${t.toLowerCase()}` },\r\n                { name: \"Luigi L\", gen: t => `(L) ${t}` },\r\n                { name: \"Peach Heart\", gen: t => `\ud83d\udc96 ${t} \ud83d\udc96` },\r\n                { name: \"Yoshi Egg\", gen: t => `\ud83e\udd5a ${t} \ud83e\udd5a` },\r\n                { name: \"Toad Stool\", gen: t => `\ud83c\udf44 ${t.toLowerCase()} \ud83c\udf44` },\r\n                { name: \"Bowser Roar\", gen: t => `\ud83e\udd96 ${t.toUpperCase()} !!` },\r\n                { name: \"Golden Shell\", gen: t => `\ud83d\udc22 ${t.toUpperCase()} \ud83d\udc22` },\r\n                { name: \"Bullet Bill\", gen: t => `\ud83d\ude80 ${t.toUpperCase()} >` },\r\n                { name: \"Tanooki Leaf\", gen: t => `\ud83c\udf43 ${t} \ud83c\udf43` },\r\n                { name: \"Lakitu Cloud\", gen: t => `\u2601\ufe0f ${t} \u2601\ufe0f` },\r\n                { name: \"Wario Wah\", gen: t => `(W) ${t.toUpperCase()}` },\r\n                { name: \"Cheep Cheep\", gen: t => `\ud83d\udc1f ${t} \ud83d\udc1f` },\r\n                { name: \"Blooper ink\", gen: t => `\ud83e\udd91 ${t.split('').join('\u00b7')} \ud83e\udd91` },\r\n                { name: \"Buzzy Beetle\", gen: t => `< ${t} >` },\r\n                { name: \"Chain Chomp\", gen: t => `\u26d3\ufe0f ${t.toUpperCase()} \u26d3\ufe0f` },\r\n                { name: \"Bob-omb\", gen: t => `\ud83d\udca3 ${t.toUpperCase()} \ud83d\udca3` },\r\n                { name: \"Whomp Block\", gen: t => `[[ ${t.toUpperCase()} ]]` },\r\n                { name: \"Piranha Plant\", gen: t => `\ud83e\udeb4 ${t} \ud83e\udeb4` },\r\n                { name: \"Shy Guy\", gen: t => `( ${t} )` },\r\n                { name: \"Magikoopa\", gen: t => `\u2728 ${convert(t, maps.script)} \u2728` },\r\n                { name: \"Monty Mole\", gen: t => `\ud83d\udd73\ufe0f ${t} \ud83d\udd73\ufe0f` },\r\n                { name: \"Level Finish\", gen: t => `\ud83d\udea9 ${t.toUpperCase()} \ud83d\udea9` },\r\n                { name: \"Brick Block\", gen: t => `\ud83e\uddf1 ${t.toUpperCase()} \ud83e\uddf1` },\r\n                { name: \"Hidden Block\", gen: t => `\u2753 ${t} \u2753` },\r\n                { name: \"Star Dust\", gen: t => `*\u00b7 ${t} \u00b7*` },\r\n                { name: \"Underground\", gen: t => `_ ${convert(t, maps.mono)} _` },\r\n                { name: \"Galaxy Trip\", gen: t => `\ud83d\ude80 ${convert(t, maps.bubble)}` },\r\n                { name: \"Paper Style\", gen: t => `- ${t} -` },\r\n                { name: \"8-Bit Dash\", gen: t => `>> ${t.toUpperCase()}` },\r\n                { name: \"Blue Shell\", gen: t => `\ud83d\ude99\ud83d\udca8 ${t.toUpperCase()}` },\r\n                { name: \"Thwomp Crush\", gen: t => `\u2193 ${t.toUpperCase()} \u2193` },\r\n                { name: \"Hammer Bro\", gen: t => `\ud83d\udd28 ${t} \ud83d\udd28` },\r\n                { name: \"Toadette\", gen: t => `\ud83c\udf80 ${t} \ud83c\udf80` },\r\n                { name: \"Rosalina\", gen: t => `\ud83c\udf0c ${t} \ud83c\udf0c` },\r\n                { name: \"Island Life\", gen: t => `\ud83c\udf34 ${t} \ud83c\udf34` },\r\n                { name: \"Rainbow Road\", gen: t => `\ud83c\udf08 ${t.toUpperCase()} \ud83c\udf08` },\r\n                { name: \"Koopa Troopa\", gen: t => `\ud83d\udc22 ${t}` },\r\n                { name: \"Mega Mushroom\", gen: t => `\u5de8\u5927 ${t.toUpperCase()}` },\r\n                { name: \"Mini Mushroom\", gen: t => `tiny ${t.toLowerCase()}` },\r\n                { name: \"Cape Mario\", gen: t => `\u7fbd ${t} \u7fbd` },\r\n                { name: \"Poison Mush\", gen: t => `\ud83d\udc80 ${t} \ud83d\udc80` },\r\n                { name: \"Sunshine\", gen: t => `\u2600\ufe0f ${t} \u2600\ufe0f` }\r\n            ];\r\n\r\n            const input = document.getElementById('m-input-field');\r\n            const grid = document.getElementById('m-results');\r\n            const moreBtn = document.getElementById('m-more-btn');\r\n\r\n            const copyIcon = '<svg class=\"m-icon\" viewBox=\"0 0 24 24\"><path d=\"M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z\"\/><\/svg>';\r\n\r\n            function copyToClipboard(text, btn) {\r\n                const doCopy = () => {\r\n                    btn.innerHTML = 'Copied';\r\n                    setTimeout(() => {\r\n                        btn.innerHTML = copyIcon;\r\n                    }, 1500);\r\n                };\r\n                if (navigator.clipboard && navigator.clipboard.writeText) {\r\n                    navigator.clipboard.writeText(text).then(doCopy).catch(() => fallbackCopy(text, btn));\r\n                } else {\r\n                    fallbackCopy(text, btn);\r\n                }\r\n            }\r\n\r\n            function fallbackCopy(text, btn) {\r\n                const textArea = document.createElement(\"textarea\");\r\n                textArea.value = text;\r\n                textArea.style.position = \"fixed\";\r\n                textArea.style.left = \"-9999px\";\r\n                document.body.appendChild(textArea);\r\n                textArea.focus();\r\n                textArea.select();\r\n                try {\r\n                    document.execCommand('copy');\r\n                    btn.innerHTML = 'Copied';\r\n                    setTimeout(() => {\r\n                        btn.innerHTML = copyIcon;\r\n                    }, 1500);\r\n                } catch (err) {\r\n                    btn.innerHTML = 'Failed';\r\n                    setTimeout(() => {\r\n                        btn.innerHTML = copyIcon;\r\n                    }, 1500);\r\n                }\r\n                document.body.removeChild(textArea);\r\n            }\r\n\r\n            function createCard(styleObj, text) {\r\n                const output = styleObj.gen(text);\r\n                const card = document.createElement('div');\r\n                card.className = 'm-card';\r\n                const header = document.createElement('div');\r\n                header.className = 'm-card-header';\r\n                const nameSpan = document.createElement('span');\r\n                nameSpan.textContent = styleObj.name;\r\n                const copyBtn = document.createElement('button');\r\n                copyBtn.className = 'm-copy-btn';\r\n                copyBtn.setAttribute('aria-label', 'Copy text');\r\n                copyBtn.innerHTML = copyIcon;\r\n                copyBtn.onclick = () => copyToClipboard(output, copyBtn);\r\n                header.appendChild(nameSpan);\r\n                header.appendChild(copyBtn);\r\n                const body = document.createElement('div');\r\n                body.className = 'm-card-body';\r\n                const scrollArea = document.createElement('div');\r\n                scrollArea.className = 'm-scroll-area';\r\n                scrollArea.textContent = output;\r\n                body.appendChild(scrollArea);\r\n                card.appendChild(header);\r\n                card.appendChild(body);\r\n                return card;\r\n            }\r\n\r\n            function render() {\r\n                grid.innerHTML = '';\r\n                const val = state.text || \"MARIO\";\r\n                styles.slice(0, state.limit).forEach(s => {\r\n                    grid.appendChild(createCard(s, val));\r\n                });\r\n                if (state.limit >= styles.length) {\r\n                    moreBtn.classList.add('m-hidden');\r\n                } else {\r\n                    moreBtn.classList.remove('m-hidden');\r\n                }\r\n            }\r\n\r\n            input.oninput = (e) => {\r\n                state.text = e.target.value;\r\n                document.getElementById('m-count').innerText = state.text.length;\r\n                render();\r\n            };\r\n\r\n            document.getElementById('m-reset-btn').onclick = () => { input.value = ''; state.text = ''; document.getElementById('m-count').innerText = '0'; render(); input.focus(); };\r\n            document.getElementById('m-rand-btn').onclick = () => {\r\n                const names = [\"MARIO\", \"LUIGI\", \"BOWSER\", \"YOSHI\", \"PEACH\", \"WARP PIPE\", \"KINGDOM\", \"QUEST\"];\r\n                input.value = names[Math.floor(Math.random() * names.length)];\r\n                state.text = input.value;\r\n                document.getElementById('m-count').innerText = state.text.length;\r\n                render();\r\n            };\r\n            document.getElementById('m-more-btn').onclick = () => { state.limit += 20; render(); };\r\n\r\n            render();\r\n        })();\r\n    <\/script>\r\n<\/div>\r\n\r\n<!-- --- END OF FILE --- --><\/div>\n<div class=\"tc-wp-tool-content\"><div class=\"wpc-scope-330\">\n<div class=\"tc-wp-content-root\" data-tc-wp-scope=\"1\" style=\"max-width:100%;box-sizing:border-box;isolation:isolate;min-width:0;position:relative;\">\n<!-- Mario Font Generator - 3 Content Sections -->\n\n<section class=\"mario-s1-root\" id=\"what-is-mario-font-generator\">\n  <div class=\"mario-s1-container\">\n    <div class=\"mario-s1-header\">\n      <h2 class=\"mario-s1-heading\">What Is a <span class=\"mario-s1-grad\">Mario Font Generator<\/span>?<\/h2>\n      <p class=\"mario-s1-subheading\">A fun retro-inspired typography tool that transforms your text into classic Nintendo-style lettering<\/p>\n    <\/div>\n    <div class=\"mario-s1-grid\">\n      <article class=\"mario-s1-card\"><div class=\"mario-s1-icon-wrap\"><i class=\"fa-solid fa-star mario-s1-icon\"><\/i><\/div><h3 class=\"mario-s1-card-title\"><span class=\"mario-s1-highlight\">Super<\/span> Star<\/h3><p class=\"mario-s1-card-desc\">Star-bracketed text for hero status.<\/p><\/article>\n      <article class=\"mario-s1-card\"><div class=\"mario-s1-icon-wrap\"><i class=\"fa-solid fa-cube mario-s1-icon\"><\/i><\/div><h3 class=\"mario-s1-card-title\"><span class=\"mario-s1-highlight\">Block<\/span> Punch<\/h3><p class=\"mario-s1-card-desc\">Squared box characters with retro feel.<\/p><\/article>\n      <article class=\"mario-s1-card\"><div class=\"mario-s1-icon-wrap\"><i class=\"fa-solid fa-circle mario-s1-icon\"><\/i><\/div><h3 class=\"mario-s1-card-title\"><span class=\"mario-s1-highlight\">Bubble<\/span> Shield<\/h3><p class=\"mario-s1-card-desc\">Circled letters for power-up style.<\/p><\/article>\n      <article class=\"mario-s1-card\"><div class=\"mario-s1-icon-wrap\"><i class=\"fa-solid fa-terminal mario-s1-icon\"><\/i><\/div><h3 class=\"mario-s1-card-title\"><span class=\"mario-s1-highlight\">Retro<\/span> Console<\/h3><p class=\"mario-s1-card-desc\">Clean monospace for old-school vibes.<\/p><\/article>\n      <article class=\"mario-s1-card\"><div class=\"mario-s1-icon-wrap\"><i class=\"fa-solid fa-italic mario-s1-icon\"><\/i><\/div><h3 class=\"mario-s1-card-title\"><span class=\"mario-s1-highlight\">Castle<\/span> Script<\/h3><p class=\"mario-s1-card-desc\">Elegant script for royal kingdom text.<\/p><\/article>\n      <article class=\"mario-s1-card\"><div class=\"mario-s1-icon-wrap\"><i class=\"fa-solid fa-dragon mario-s1-icon\"><\/i><\/div><h3 class=\"mario-s1-card-title\"><span class=\"mario-s1-highlight\">Boss<\/span> Fight<\/h3><p class=\"mario-s1-card-desc\">Bold weight for final battle moments.<\/p><\/article>\n      <article class=\"mario-s1-card\"><div class=\"mario-s1-icon-wrap\"><i class=\"fa-solid fa-gothic mario-s1-icon\"><\/i><\/div><h3 class=\"mario-s1-card-title\"><span class=\"mario-s1-highlight\">Boo<\/span> Ghost<\/h3><p class=\"mario-s1-card-desc\">Gothic fraktur with a haunted twist.<\/p><\/article>\n      <article class=\"mario-s1-card\"><div class=\"mario-s1-icon-wrap\"><i class=\"fa-solid fa-wand-magic-sparkles mario-s1-icon\"><\/i><\/div><h3 class=\"mario-s1-card-title\"><span class=\"mario-s1-highlight\">Power<\/span> Ups<\/h3><p class=\"mario-s1-card-desc\">50+ Mario-themed style variations.<\/p><\/article>\n    <\/div>\n  <\/div>\n<\/section>\n\n<section class=\"mario-s2-root\" id=\"why-use-mario-font-generator\">\n  <div class=\"mario-s2-container\">\n    <div class=\"mario-s2-header\">\n      <h2 class=\"mario-s2-heading\">Why Use a <span class=\"mario-s2-grad\">Mario Font Generator<\/span>?<\/h2>\n      <p class=\"mario-s2-subheading\">Add nostalgic Nintendo charm to your text across any project<\/p>\n    <\/div>\n    <div class=\"mario-s2-grid\">\n      <article class=\"mario-s2-card\"><div class=\"mario-s2-icon-wrap\"><i class=\"fa-solid fa-gamepad mario-s2-icon\"><\/i><\/div><h3 class=\"mario-s2-card-title\"><span class=\"mario-s2-highlight\">Gaming<\/span> Content<\/h3><p class=\"mario-s2-card-desc\">Let's plays, streams, and retro reviews.<\/p><\/article>\n      <article class=\"mario-s2-card\"><div class=\"mario-s2-icon-wrap\"><i class=\"fa-solid fa-hashtag mario-s2-icon\"><\/i><\/div><h3 class=\"mario-s2-card-title\"><span class=\"mario-s2-highlight\">Social<\/span> Media<\/h3><p class=\"mario-s2-card-desc\">Fun captions and gaming-themed bios.<\/p><\/article>\n      <article class=\"mario-s2-card\"><div class=\"mario-s2-icon-wrap\"><i class=\"fa-solid fa-clapperboard mario-s2-icon\"><\/i><\/div><h3 class=\"mario-s2-card-title\"><span class=\"mario-s2-highlight\">Video<\/span> Titles<\/h3><p class=\"mario-s2-card-desc\">YouTube thumbnails and intro text.<\/p><\/article>\n      <article class=\"mario-s2-card\"><div class=\"mario-s2-icon-wrap\"><i class=\"fa-solid fa-shirt mario-s2-icon\"><\/i><\/div><h3 class=\"mario-s2-card-title\"><span class=\"mario-s2-highlight\">Merch<\/span><\/h3><p class=\"mario-s2-card-desc\">Retro apparel and fan designs.<\/p><\/article>\n      <article class=\"mario-s2-card\"><div class=\"mario-s2-icon-wrap\"><i class=\"fa-solid fa-palette mario-s2-icon\"><\/i><\/div><h3 class=\"mario-s2-card-title\"><span class=\"mario-s2-highlight\">Fan<\/span> Art<\/h3><p class=\"mario-s2-card-desc\">Creative titles and project headers.<\/p><\/article>\n      <article class=\"mario-s2-card\"><div class=\"mario-s2-icon-wrap\"><i class=\"fa-solid fa-comment mario-s2-icon\"><\/i><\/div><h3 class=\"mario-s2-card-title\"><span class=\"mario-s2-highlight\">Chat<\/span> Names<\/h3><p class=\"mario-s2-card-desc\">Discord and chat usernames with flair.<\/p><\/article>\n      <article class=\"mario-s2-card\"><div class=\"mario-s2-icon-wrap\"><i class=\"fa-solid fa-gift mario-s2-icon\"><\/i><\/div><h3 class=\"mario-s2-card-title\"><span class=\"mario-s2-highlight\">Invitations<\/span><\/h3><p class=\"mario-s2-card-desc\">Party invites and event announcements.<\/p><\/article>\n      <article class=\"mario-s2-card\"><div class=\"mario-s2-icon-wrap\"><i class=\"fa-solid fa-cake-candles mario-s2-icon\"><\/i><\/div><h3 class=\"mario-s2-card-title\"><span class=\"mario-s2-highlight\">Fun<\/span> Projects<\/h3><p class=\"mario-s2-card-desc\">Any creative work needing a playful touch.<\/p><\/article>\n    <\/div>\n  <\/div>\n<\/section>\n\n<section class=\"mario-s3-root\" id=\"how-to-use-mario-font-generator\">\n  <div class=\"mario-s3-container\">\n    <div class=\"mario-s3-header\">\n      <h2 class=\"mario-s3-heading\">How to Use the <span class=\"mario-s3-grad\">Mario Font Generator<\/span><\/h2>\n      <p class=\"mario-s3-subheading\">Transform your text into power-up style in a few simple steps<\/p>\n    <\/div>\n    <div class=\"mario-s3-grid\">\n      <article class=\"mario-s3-card\"><span class=\"mario-s3-step-badge\">1<\/span><div class=\"mario-s3-icon-wrap\"><i class=\"fa-solid fa-pencil mario-s3-icon\"><\/i><\/div><h3 class=\"mario-s3-card-title\"><span class=\"mario-s3-highlight\">Type<\/span> Text<\/h3><p class=\"mario-s3-card-desc\">Enter any word or phrase to mushroomify.<\/p><\/article>\n      <article class=\"mario-s3-card\"><span class=\"mario-s3-step-badge\">2<\/span><div class=\"mario-s3-icon-wrap\"><i class=\"fa-solid fa-table-cells mario-s3-icon\"><\/i><\/div><h3 class=\"mario-s3-card-title\"><span class=\"mario-s3-highlight\">Browse<\/span> Styles<\/h3><p class=\"mario-s3-card-desc\">Scroll through Mario-themed font formats.<\/p><\/article>\n      <article class=\"mario-s3-card\"><span class=\"mario-s3-step-badge\">3<\/span><div class=\"mario-s3-icon-wrap\"><i class=\"fa-solid fa-copy mario-s3-icon\"><\/i><\/div><h3 class=\"mario-s3-card-title\"><span class=\"mario-s3-highlight\">Copy<\/span> Power-up<\/h3><p class=\"mario-s3-card-desc\">Click copy and paste into your project.<\/p><\/article>\n      <article class=\"mario-s3-card\"><span class=\"mario-s3-step-badge\">4<\/span><div class=\"mario-s3-icon-wrap\"><i class=\"fa-solid fa-arrow-down mario-s3-icon\"><\/i><\/div><h3 class=\"mario-s3-card-title\"><span class=\"mario-s3-highlight\">More<\/span> Worlds<\/h3><p class=\"mario-s3-card-desc\">Load additional style variations on demand.<\/p><\/article>\n      <article class=\"mario-s3-card\"><span class=\"mario-s3-step-badge\">5<\/span><div class=\"mario-s3-icon-wrap\"><i class=\"fa-solid fa-rotate mario-s3-icon\"><\/i><\/div><h3 class=\"mario-s3-card-title\"><span class=\"mario-s3-highlight\">Live<\/span> Preview<\/h3><p class=\"mario-s3-card-desc\">All styles update instantly as you type.<\/p><\/article>\n      <article class=\"mario-s3-card\"><span class=\"mario-s3-step-badge\">6<\/span><div class=\"mario-s3-icon-wrap\"><i class=\"fa-solid fa-dice mario-s3-icon\"><\/i><\/div><h3 class=\"mario-s3-card-title\"><span class=\"mario-s3-highlight\">Random<\/span> Power-up<\/h3><p class=\"mario-s3-card-desc\">Get instant Mario-themed sample inspiration.<\/p><\/article>\n      <article class=\"mario-s3-card\"><span class=\"mario-s3-step-badge\">7<\/span><div class=\"mario-s3-icon-wrap\"><i class=\"fa-solid fa-eraser mario-s3-icon\"><\/i><\/div><h3 class=\"mario-s3-card-title\"><span class=\"mario-s3-highlight\">Reset<\/span> Game<\/h3><p class=\"mario-s3-card-desc\">Clear and start fresh with one click.<\/p><\/article>\n      <article class=\"mario-s3-card\"><span class=\"mario-s3-step-badge\">8<\/span><div class=\"mario-s3-icon-wrap\"><i class=\"fa-solid fa-mushroom mario-s3-icon\"><\/i><\/div><h3 class=\"mario-s3-card-title\"><span class=\"mario-s3-highlight\">Explore<\/span> All<\/h3><p class=\"mario-s3-card-desc\">Try 50+ different Mario style combos.<\/p><\/article>\n    <\/div>\n  <\/div>\n<\/section>\n<\/div>\n<\/div><\/div>\n<\/section>\n<\/div>\n","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-5871","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/fontono.com\/wp-json\/wp\/v2\/pages\/5871","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fontono.com\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/fontono.com\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/fontono.com\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/fontono.com\/wp-json\/wp\/v2\/comments?post=5871"}],"version-history":[{"count":0,"href":"https:\/\/fontono.com\/wp-json\/wp\/v2\/pages\/5871\/revisions"}],"wp:attachment":[{"href":"https:\/\/fontono.com\/wp-json\/wp\/v2\/media?parent=5871"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}