Constructor de plantillas de email

Construye plantillas de email HTML responsivas con vista previa en vivo, CSS en linea y copia al portapapeles. Diseño basado en tablas para compatibilidad con clientes de correo.

Plantilla

Nombre de la empresa

URL del logo (opcional)

Color principal

Encabezado

Texto del cuerpo

Texto del boton

URL del boton

Texto del pie

Vista previa en vivo

Codigo HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Welcome aboard!</title>
</head>
<body style="margin: 0; padding: 0; background-color: #f4f4f7; font-family: Arial, Helvetica, sans-serif;">
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="background-color: #f4f4f7;" role="presentation">
<tr><td align="center" style="padding: 20px 10px;">
<table border="0" cellpadding="0" cellspacing="0" width="600" style="max-width: 600px; background-color: #ffffff; border-radius: 8px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,0.05);" role="presentation">

        <tr><td align="center" style="padding: 30px 0 20px 0; font-family: Arial, Helvetica, sans-serif; font-size: 24px; font-weight: bold; color: #4f46e5;">My Company</td></tr>
        <tr><td style="padding: 0 40px;"><table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation">
          <tr><td style="padding: 20px 0 10px 0; font-family: Arial, Helvetica, sans-serif; font-size: 28px; font-weight: bold; color: #333333; text-align: center;">Welcome aboard!</td></tr>
          <tr><td style="padding: 10px 0; font-family: Arial, Helvetica, sans-serif; font-size: 16px; line-height: 24px; color: #555555; text-align: center;">Thank you for joining us. We are excited to have you on board.</td></tr>
          <tr><td align="center" style="padding: 25px 0;"><table border="0" cellpadding="0" cellspacing="0" role="presentation"><tr><td align="center" style="border-radius: 6px; background-color: #4f46e5;"><a href="https://example.com" target="_blank" style="display: inline-block; padding: 14px 30px; font-family: Arial, Helvetica, sans-serif; font-size: 16px; font-weight: bold; color: #ffffff; text-decoration: none; border-radius: 6px;">Get Started</a></td></tr></table></td></tr>
        </table></td></tr>
<tr><td style="padding: 20px 40px 30px 40px; background-color: #f9f9f9; border-top: 1px solid #eeeeee;">
<table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation">
<tr><td style="font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 20px; color: #999999; text-align: center;">My Company, 123 Main Street, City, Country</td></tr>
</table>
</td></tr>
</table>
</td></tr>
</table>
</body>
</html>

Ctrl+Enter ejecutarCtrl+Shift+C copiar

Más información

Email Template Builder: Design Cross-Client HTML Emails

Build HTML email templates that render correctly in Gmail, Outlook, and Apple Mail. Visual editor with table-based output.

Why Email Templates Matter for Every Business

Email remains the highest-ROI marketing channel, but poorly formatted emails get ignored or land in spam. A well-structured HTML email template ensures your message renders correctly across Gmail, Outlook, Apple Mail, and dozens of other clients, each with their own rendering quirks.

5 min de lecturaLeer la guía completa

Herramientas relacionadas

¿Sabías que?

Generador de contraseñas

Seguridad

Genera contraseñas fuertes y aleatorias con longitud, conjuntos de caracteres y generación masiva personalizables.

Generador de contraseñas

Generador UUID

Generador de números aleatorios