{"id":470710,"url":"\/club-logo-generator\/","layout":"standard","version":"2025-06-28T14:01:06.000000Z","blocks":[{"id":4448731,"type":"textBlock","published":1,"size":{"x":12,"y":0},"order":0,"items":[],"properties":{"html":{"id":108110148,"value":"

Sports Team Logo Maker<\/h2>

Kitlocker is the home of grassroots sport. We know how hard it can be to get a high quality club crest made up, so we made this free online sports club logo generator that you can use to get a badge for your sports team. It's totally free - we'll mail you a high res version. And if you want to help Kitlocker continue to support grassroots sport, check out our range of club kits: A great next step once you've got your new free logo.<\/p>"},"borderRadius":{"id":108110149,"value":"#{text.border.radius}"},"textColor":{"id":108110150,"value":"#{text.color}"},"backgroundColour":{"id":108110151,"value":"#0000"},"truncateHeight":{"id":108110152,"value":null},"template":{"id":108110153,"value":"text"},"padding":{"id":108110154,"value":"6"},"fullWidth":{"id":108110155,"value":"0"},"fullBackgroundColor":{"id":108110156,"value":"#{text.fullBackground.color}"},"published":{"id":108110157,"value":"1"},"conditions":{"id":108110158,"value":"[]"}}},{"id":4448732,"type":"html","published":1,"size":{"x":12,"y":0},"order":1,"items":[],"properties":{"html":{"id":108110159,"value":"\n\n\n\n \n \n Team Logo Generator<\/title>\n <style>\n .logo-generator-container {\n display: flex;\n flex-direction: column;\n gap: 30px;\n }\n\n @media (min-width: 768px) {\n .logo-generator-container {\n flex-direction: row;\n align-items: flex-start;\n }\n }\n\n .logo-generator-form {\n flex: 1;\n background-color: #f9f9f9;\n padding: 30px;\n border-radius: 10px;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);\n }\n\n .logo-preview {\n flex: 1;\n text-align: center;\n padding: 30px;\n border: 2px dashed #ccc;\n border-radius: 10px;\n position: relative;\n }\n\n .logo-preview img {\n max-width: 100%;\n display: none;\n border-radius: 8px;\n background: #fff;\n }\n\n .placeholder-logo {\n display: flex;\n justify-content: center;\n align-items: center;\n height: 300px;\n color: #bbb;\n border: 2px dashed #ddd;\n font-style: italic;\n font-size: 16px;\n }\n\n h1 {\n text-align: center;\n color: #222;\n }\n\n .form-group {\n margin-bottom: 18px;\n }\n\n label {\n display: block;\n margin-bottom: 6px;\n color: #333;\n }\n\n input[type=\"text\"],\n input[type=\"email\"],\n select,\n textarea {\n width: 100%;\n padding: 10px;\n border: 1px solid #ccc;\n border-radius: 5px;\n box-sizing: border-box;\n }\n\n textarea {\n resize: vertical;\n }\n\n button[type=\"submit\"] {\n background-color: #000;\n color: #fff;\n padding: 12px 18px;\n border: none;\n border-radius: 3px;\n cursor: pointer;\n font-size: 16px;\n width: 100%;\n }\n\n button[type=\"submit\"]:hover {\n background-color: #333;\n }\n\n .privacy-link {\n text-align: center;\n margin-top: 10px;\n font-size: 0.85em;\n }\n\n .privacy-link a {\n color: #007bff;\n text-decoration: none;\n }\n\n .spinner {\n border: 4px solid #eee;\n border-top: 4px solid #666;\n border-radius: 50%;\n width: 40px;\n height: 40px;\n animation: spin 1s linear infinite;\n margin: 20px auto;\n position: relative;\n }\n\n @keyframes spin {\n 0% { transform: rotate(0deg); }\n 100% { transform: rotate(360deg); }\n }\n\n .countdown-text {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n font-size: 12px;\n color: #666;\n }\n\n .error-message {\n color: red;\n text-align: center;\n margin-top: 10px;\n }\n <\/style>\n<\/head>\n\n<body>\n <div class=\"logo-generator-container\">\n\n <form id=\"logoForm\" class=\"logo-generator-form\">\n <div class=\"form-group\">\n <label for=\"clubName\">Club Name*<\/label>\n <input type=\"text\" id=\"clubName\" name=\"clubName\" required>\n <\/div>\n\n <div class=\"form-group\">\n <label for=\"sport\">Sport*<\/label>\n <select id=\"sport\" name=\"sport\">\n <option value=\"Football\" selected>Football<\/option>\n <option value=\"Cricket\">Cricket<\/option>\n <option value=\"Rugby\">Rugby<\/option>\n <option value=\"Hockey\">Hockey<\/option>\n <option value=\"Netball\">Netball<\/option>\n <option value=\"Basketball\">Basketball<\/option>\n <option value=\"Tennis\">Tennis<\/option>\n <option value=\"Golf\">Golf<\/option>\n <option value=\"Athletics\">Athletics<\/option>\n <option value=\"Esports\">Esports<\/option>\n <option value=\"Volleyball\">Volleyball<\/option>\n <option value=\"Generic\">Generic\/Other<\/option>\n <\/select>\n <\/div>\n\n <div class=\"form-group\">\n <label for=\"motto\">Motto<\/label>\n <input type=\"text\" id=\"motto\" name=\"motto\">\n <\/div>\n\n <div class=\"form-group\">\n <label for=\"clubImagery\">Themes<\/label>\n <textarea id=\"clubImagery\" name=\"clubImagery\" placeholder=\"E.g., Lion, Flames, Cannon\"><\/textarea>\n <\/div>\n\n <div class=\"form-group\">\n <label for=\"logoStyle\">Logo Style*<\/label>\n <select id=\"logoStyle\" name=\"logoStyle\">\n <option value=\"Classic\">Classic<\/option>\n <option value=\"Modern\">Modern<\/option>\n <option value=\"Minimal\">Minimal<\/option>\n <option value=\"Futuristic\">Futuristic<\/option>\n <option value=\"Cartoon\">Cartoon<\/option>\n <\/select>\n <\/div>\n\n <div class=\"form-group\">\n <label for=\"fontStyle\">Font Style<\/label>\n <select id=\"fontStyle\" name=\"fontStyle\">\n <option value=\"auto\">Auto<\/option>\n <option value=\"Bold\">Bold<\/option>\n <option value=\"Serif\">Serif<\/option>\n <option value=\"Sans-serif\">Sans-serif<\/option>\n <option value=\"Script\">Script<\/option>\n <\/select>\n <\/div>\n\n <div class=\"form-group\">\n <label for=\"userEmail\">Email<\/label>\n <input type=\"email\" id=\"userEmail\" name=\"userEmail\" required>\n <\/div>\n\n <button type=\"submit\">Generate<\/button>\n <p class=\"privacy-link\"><small>By submitting, you agree to our <a href=\"\/privacy-policy\/\" target=\"_blank\">privacy policy<\/a>.<\/small><\/p>\n <\/form>\n\n <div class=\"logo-preview\" id=\"logoPreview\">\n <div class=\"placeholder-logo\" id=\"placeholderLogo\">Your logo will appear here<\/div>\n <div class=\"spinner\" id=\"loadingSpinner\" style=\"display: none;\">\n <div class=\"countdown-text\" id=\"countdownText\">30s<\/div>\n <\/div>\n <img id=\"generatedLogo\" src=\"#\" alt=\"Generated Logo\">\n <a id=\"downloadLogoBtn\" href=\"#\" style=\"display: none;\">Download<\/a>\n <p id=\"errorMessage\" class=\"error-message\"><\/p>\n <\/div>\n\n <\/div>\n\n <script>\n const logoForm = document.getElementById('logoForm');\n const generatedLogo = document.getElementById('generatedLogo');\n const downloadLogoBtn = document.getElementById('downloadLogoBtn');\n const loadingSpinner = document.getElementById('loadingSpinner');\n const placeholderLogo = document.getElementById('placeholderLogo');\n const errorMessage = document.getElementById('errorMessage');\n const countdownText = document.getElementById('countdownText');\n\n const API_ENDPOINT = 'https:\/\/club-logo-generator-585670476393.europe-west2.run.app';\n\n logoForm.addEventListener('submit', async (event) => {\n event.preventDefault();\n\n const formData = new FormData(logoForm);\n const dataForServer = {\n sport: formData.get('sport'),\n fontStyle: formData.get('fontStyle'),\n logoStyle: formData.get('logoStyle'),\n clubName: formData.get('clubName'),\n motto: formData.get('motto'),\n clubImagery: formData.get('clubImagery'),\n userEmail: formData.get('userEmail'),\n action: 'generate'\n };\n\n placeholderLogo.style.display = 'none';\n generatedLogo.style.display = 'none';\n downloadLogoBtn.style.display = 'none';\n errorMessage.textContent = '';\n loadingSpinner.style.display = 'block';\n\n let countdown = 30;\n countdownText.textContent = countdown;\n const timer = setInterval(() => {\n countdown--;\n if (countdown > 0) {\n countdownText.textContent = countdown + 's';\n } else {\n countdownText.textContent = 'loading';\n clearInterval(timer);\n }\n }, 1000);\n\n try {\n const response = await fetch(API_ENDPOINT, {\n method: 'POST',\n headers: { 'Content-Type': 'application\/json' },\n body: JSON.stringify(dataForServer)\n });\n\n const result = await response.json();\n loadingSpinner.style.display = 'none';\n\n if (response.ok && result.b64Json) {\n const dataUrl = 'data:image\/png;base64,' + result.b64Json;\n generatedLogo.src = dataUrl;\n generatedLogo.style.display = 'block';\n downloadLogoBtn.href = dataUrl;\n downloadLogoBtn.download = (formData.get('clubName') || 'logo') + '_logo.png';\n downloadLogoBtn.style.display = 'inline-block';\n } else {\n errorMessage.textContent = result.error || 'Failed to generate logo.';\n }\n } catch (err) {\n loadingSpinner.style.display = 'none';\n errorMessage.textContent = 'Error: ' + err.message;\n }\n });\n <\/script>\n<\/body>\n\n<\/html>"},"template":{"id":108110160,"value":"html"},"padding":{"id":108110161,"value":"6"},"fullWidth":{"id":108110162,"value":"0"},"fullBackgroundColor":{"id":108110163,"value":"#fff0"},"published":{"id":108110164,"value":"1"},"conditions":{"id":108110165,"value":"[]"}}}],"properties":{"title":{"id":108110145,"value":"Club Logo Generator"},"isStorePage":{"id":108110146,"value":"1"},"ogImage":{"id":108110147,"value":"https:\/\/images.podos.io\/ar30ztokmzl9pu7vneya1bbabwcrcq1etaari8zf9scq5t97.png.png?w=1200&h=auto"}},"labels":[],"published":1,"sitemap":1,"divisionId":401843,"edited":true,"keyPhraseCampaignId":null}