Simulador de E-mail

Construa visualmente um layout de e-mail e visualize o código HTML gerado.

Elementos

Estilos

Preview do E-mail

Código HTML Gerado

Dicas para E-mail HTML

Boas práticas para garantir compatibilidade e entrega.

Use Tabelas para Layout

Apesar de antigo, layouts baseados em `

` ainda são a forma mais confiável de garantir consistência entre diferentes clientes de e-mail (Outlook, Gmail, etc.).

CSS Inline

Muitos clientes de e-mail removem tags `

${contentHtml}
`; htmlCodeOutput.value = fullHtml; } function copyGeneratedHTML() { if (htmlCodeOutput.value) { navigator.clipboard.writeText(htmlCodeOutput.value).then(() => { showToast('Código HTML copiado!'); }).catch(err => { try { htmlCodeOutput.select(); document.execCommand('copy'); showToast('Código HTML copiado! (fallback)'); } catch (execErr) { alert("Erro ao copiar. Por favor, copie manualmente."); } }); } } function showToast(message) { toast.textContent = message; toast.classList.add('show'); setTimeout(() => { toast.classList.remove('show'); }, 2000); }