QuickLaunch — Clean Header (No Hover Effects)
Free Email Signature Generator · QuickLaunch Tools
Free Tool

Email Signature Generator

Create professional email signatures with custom designs, colors, and fonts. Choose from multiple templates that work with all email clients.

Design & details

Design
Content
Social & Media
Modern
📋
Classic
▫️
Minimal
💪
Bold
Recommended: 14px for best compatibility
This could be a disclaimer, call to action, or custom message
📁
Click to upload image
PNG, JPG up to 2MB
Preview

Preview & export

Live preview

Get your signature code

Enter your details to copy HTML and download your professional email signature.

Copied!
`; const blob = new Blob([fullHTML], { type: 'text/html' }); const url = URL.createObjectURL(blob); const a = document.createElement('a'); a.href = url; a.download = 'email-signature.html'; a.click(); URL.revokeObjectURL(url); toast('Signature downloaded!'); E.instructions.style.display = 'block'; }); });E.showCode.addEventListener('click', () => { showGate(() => { E.codeWrapper.style.display = E.codeWrapper.style.display === 'none' ? 'block' : 'none'; }); });E.exportImage.addEventListener('click', () => { showGate(() => { toast('Export as image coming soon!'); // In a real implementation, you would use html2canvas or similar library // to convert the signature preview to an image }); });E.save.addEventListener('click', () => { const data = { template: currentTemplate, color: currentColor, font: E.fontFamily.value, fontSize: E.fontSize.value, fullName: E.fullName.value, jobTitle: E.jobTitle.value, company: E.company.value, department: E.department.value, email: E.email.value, phone: E.phone.value, website: E.website.value, address: E.address.value, customText: E.customText.value, socialNetworks: Array.from(activeSocialNetworks), linkedinUrl: $('#linkedinUrl').value, twitterUrl: $('#twitterUrl').value, facebookUrl: $('#facebookUrl').value, instagramUrl: $('#instagramUrl').value, youtubeUrl: $('#youtubeUrl').value, githubUrl: $('#githubUrl').value, uploadedImage: uploadedImage, imageSize: E.imageSize.value }; localStorage.setItem('ql-email-sig-data', JSON.stringify(data)); toast('Draft saved!'); });E.load.addEventListener('click', () => { try { const data = JSON.parse(localStorage.getItem('ql-email-sig-data') || '{}'); if (!data.fullName) return toast('Nothing saved'); currentTemplate = data.template || 'modern'; currentColor = data.color || '#e53e3e'; activeSocialNetworks = new Set(data.socialNetworks || []); // Update template selection $$('.design-option').forEach(opt => { opt.classList.toggle('active', opt.dataset.template === currentTemplate); }); // Update color selection $$('.color-swatch').forEach(swatch => { swatch.classList.toggle('active', swatch.dataset.color === currentColor); }); // Update social media selection $$('.social-option').forEach(opt => { opt.classList.toggle('active', activeSocialNetworks.has(opt.dataset.social)); }); // Update form fields E.fontFamily.value = data.font || 'Arial, sans-serif'; E.fontSize.value = data.fontSize || '14px'; E.fullName.value = data.fullName || ''; E.jobTitle.value = data.jobTitle || ''; E.company.value = data.company || ''; E.department.value = data.department || ''; E.email.value = data.email || ''; E.phone.value = data.phone || ''; E.website.value = data.website || ''; E.address.value = data.address || ''; E.customText.value = data.customText || ''; // Update social URLs $('#linkedinUrl').value = data.linkedinUrl || ''; $('#twitterUrl').value = data.twitterUrl || ''; $('#facebookUrl').value = data.facebookUrl || ''; $('#instagramUrl').value = data.instagramUrl || ''; $('#youtubeUrl').value = data.youtubeUrl || ''; $('#githubUrl').value = data.githubUrl || ''; // Update image if (data.uploadedImage) { uploadedImage = data.uploadedImage; E.imagePreview.src = uploadedImage; E.imagePreview.style.display = 'block'; E.imageUploadArea.classList.add('active'); E.imageSizeField.style.display = 'block'; E.imageSize.value = data.imageSize || '80px'; } // Show/hide URL fields $$('.social-url-field').forEach(field => { field.style.display = 'none'; }); activeSocialNetworks.forEach(social => { $(`.social-url-field[data-social="${social}"]`).style.display = 'block'; }); E.socialUrls.style.display = activeSocialNetworks.size > 0 ? 'block' : 'none'; generateSignature(); toast('Draft loaded!'); } catch (err) { toast('Could not load'); } });E.clear.addEventListener('click', () => { if (!confirm('Clear all fields?')) return; E.fullName.value = ''; E.jobTitle.value = ''; E.company.value = ''; E.department.value = ''; E.email.value = ''; E.phone.value = ''; E.website.value = ''; E.address.value = ''; E.customText.value = ''; // Clear social media $$('.social-option').forEach(opt => opt.classList.remove('active')); activeSocialNetworks.clear(); $$('.social-url-field input').forEach(input => input.value = ''); E.socialUrls.style.display = 'none'; // Clear image uploadedImage = null; E.imagePreview.style.display = 'none'; E.imageUploadArea.classList.remove('active'); E.imageSizeField.style.display = 'none'; E.imageUpload.value = ''; generateSignature(); });// Initialize generateSignature(); })();