Generador de firmas de correo: firmas HTML para Gmail y Outlook
Crea una firma de correo HTML profesional que se vea bien en Gmail, Outlook y Apple Mail, y cópiala con un clic.
Ver código HTML (3049 caracteres)
<table role="presentation" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;font-family:Arial, Arial, Helvetica, sans-serif;font-size:13px;line-height:19px;color:#4b5563;"><tr><td valign="top" style="padding:0 16px 0 0;"><table role="presentation" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;"><tr><td width="64" height="64" align="center" valign="middle" style="width:64px;height:64px;background:#244b3f;color:#ffffff;font-family:Arial, Arial, Helvetica, sans-serif;font-size:24px;font-weight:bold;text-align:center;border-radius:32px;">AM</td></tr></table></td><td width="1" style="width:1px;background:#244b3f;font-size:1px;line-height:1px;"> </td><td valign="top" style="padding:0 0 0 16px;font-family:Arial, Arial, Helvetica, sans-serif;font-size:13px;line-height:19px;color:#4b5563;"><div style="font-family:Arial, Arial, Helvetica, sans-serif;font-size:16px;line-height:20px;font-weight:bold;color:#111827;">Alex Morgan</div><div style="font-family:Arial, Arial, Helvetica, sans-serif;font-size:13px;line-height:18px;color:#244b3f;padding-top:2px;">Director de Marketing <span style="color:#d1d5db;">|</span> Northwind Studio</div><div style="padding-top:8px;"><span style="color:#244b3f;font-weight:bold;">P</span> <a href="tel:+14165550142" style="color:#4b5563;text-decoration:none;">+1 (416) 555-0142</a><br><span style="color:#244b3f;font-weight:bold;">E</span> <a href="mailto:alex@northwind.example" style="color:#4b5563;text-decoration:none;">alex@northwind.example</a><br><span style="color:#244b3f;font-weight:bold;">W</span> <a href="https://www.northwind.example" style="color:#4b5563;text-decoration:none;">www.northwind.example</a><br><span style="color:#4b5563;">120 King St W, Toronto, ON</span></div><table role="presentation" cellpadding="0" cellspacing="0" border="0" align="left" style="border-collapse:collapse;margin-top:8px;"><tr><td style="padding:0 4px 0 0;"><a href="https://linkedin.com/in/alexmorgan" title="LinkedIn" style="display:inline-block;background:#244b3f;color:#ffffff;font-family:Arial, Arial, Helvetica, sans-serif;font-size:11px;font-weight:bold;line-height:22px;width:24px;height:22px;text-align:center;text-decoration:none;border-radius:3px;">in</a></td><td style="padding:0 4px 0 0;"><a href="https://x.com/alexmorgan" title="X" style="display:inline-block;background:#244b3f;color:#ffffff;font-family:Arial, Arial, Helvetica, sans-serif;font-size:11px;font-weight:bold;line-height:22px;width:24px;height:22px;text-align:center;text-decoration:none;border-radius:3px;">X</a></td></tr></table><table role="presentation" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;margin-top:10px;"><tr><td style="background:#244b3f;padding:6px 12px;border-radius:3px;"><a href="https://northwind.example/book" style="color:#ffffff;font-family:Arial, Arial, Helvetica, sans-serif;font-size:12px;font-weight:bold;text-decoration:none;">Reserva una llamada de 20 minutos</a></td></tr></table></td></tr></table>
Cómo instalarla
- Haz clic en "Copiar firma" arriba.
- En Gmail, abre Configuración (icono de rueda dentada) → Ver todos los ajustes → General.
- Baja hasta Firma, haz clic en "Crear nueva", ponle un nombre y pega (Ctrl/Cmd+V) en el cuadro.
- En "Valores predeterminados de firma", elígela para los correos nuevos y las respuestas, y haz clic en "Guardar cambios" abajo del todo.
- Gmail limita las firmas a 10 000 caracteres y solo muestra imágenes cargadas desde una URL https:// pública.
Firmas para todo el equipo (CSV)
Sube un CSV con una fila de cabecera: name, title, email, phone, mobile, linkedin, x, github, photo (URL). Cada fila se convierte en su propia firma con la plantilla y los colores elegidos arriba. La empresa, el sitio web, la dirección, el logotipo, el botón y el aviso legal se toman del formulario, salvo que el CSV tenga su propia columna para ellos. Hasta 500 personas.
Tus datos se quedan en tu navegador: la firma se crea en esta página y no se sube ni se guarda nada. Las imágenes se cargan desde las URL que introduces. Ver todas las herramientas gratis.
¿Encontraste un problema o algo que podría mejorar? Leemos todos los mensajes y lo arreglamos rápido.
Este generador de firmas de correo crea una firma a partir de tu nombre, cargo, datos de contacto, foto o logotipo, enlaces a redes sociales y color de marca, la muestra en vivo en seis plantillas y te da un HTML que resiste en los clientes de correo que la gente usa de verdad. Haz clic en “Copiar firma”, pégala en el cuadro de firma de Gmail o de Outlook y conservará su diseño.
Los clientes de correo no son navegadores web. Outlook clásico para Windows renderiza el HTML con Microsoft Word, Gmail elimina los bloques style y las clases CSS, y la mayoría de los clientes bloquean las imágenes que no están en una dirección https:// pública. Por eso, el resultado usa solo tablas anidadas y estilos en línea, fuentes seguras para la web y tamaños de imagen explícitos. Lo que no puede hacer es alojar tus imágenes: una foto o un logotipo tienen que estar ya en internet, y la página te explica por qué si intentas usar un archivo local. Para todo un equipo, sube un CSV con los nombres, cargos y teléfonos de la plantilla y descarga una firma HTML por persona, todas con la misma plantilla y el mismo color de marca.
Cómo usarla
- Rellena tus datos. Los campos vacíos se omiten por completo en la firma.
- Pega la URL https:// de una foto o un logotipo alojados, o deja ambos vacíos para usar un recuadro con iniciales.
- Elige una plantilla y un color de marca, y añade enlaces a redes sociales, un botón o un aviso legal si los necesitas.
- Haz clic en “Copiar firma” y pégala en la configuración de firma de tu cliente de correo. Los pasos de instalación de cada cliente están debajo de la vista previa.
- Envíate un correo de prueba y revísalo tanto en el móvil como en el ordenador.
Preguntas frecuentes
¿Cómo añado una firma HTML en Gmail?
Haz clic en “Copiar firma” en esta página; después, en Gmail, abre Configuración, Ver todos los ajustes, General, baja hasta Firma, haz clic en Crear y pega en el cuadro. Selecciónala en Valores predeterminados de firma y haz clic en Guardar cambios, al final de la página. No pegues el código fuente HTML: el editor de Gmail solo acepta la firma ya renderizada, que es lo que el botón de copiar pone en tu portapapeles.
¿Por qué no se ven las imágenes de mi firma?
Normalmente porque la imagen no está en una URL https:// pública. Gmail elimina las imágenes base64 (data:) de las firmas, Outlook bloquea muchas imágenes externas hasta que el destinatario las permite, y las imágenes en http:// o detrás de un inicio de sesión fallan en todas partes. Aloja la imagen en tu sitio web o en un CDN, usa el enlace https:// y mantenla ligera (por debajo de unos 100 KB).
¿Por qué mi firma se ve distinta en Outlook?
Outlook clásico para Windows usa Word para renderizar el correo, y Word ignora muchas propiedades CSS, incluidas las esquinas redondeadas, así que una foto redonda aparece cuadrada y el espaciado puede variar un poco. Este generador evita el CSS de diseño que Word descarta usando tablas, y por eso la estructura se mantiene. El nuevo Outlook y Outlook en la web renderizan de forma más parecida a un navegador.
¿Qué tamaño debe tener la foto o el logotipo de una firma de correo?
Muéstralo con unos 80–120 px de ancho y sube una imagen del doble de ese tamaño (por ejemplo, 176×176 px para una foto de 88 px) para que se vea nítida en pantallas de alta densidad. Mantén el archivo por debajo de 100 KB. Usa PNG para logotipos de colores planos y JPG para fotos.
¿Cuánto puede ocupar una firma de correo?
Gmail limita las firmas a 10 000 caracteres de HTML, muy por encima de lo que genera esta herramienta. En la práctica, limítala a cuatro o cinco líneas: nombre, cargo y empresa, una o dos formas de contacto y como mucho una llamada a la acción. Las firmas largas se recortan en las respuestas y en el móvil empujan tu mensaje fuera de la primera pantalla.
Lo que de verdad funciona en las firmas de correo
• Tablas para el diseño, no divs con flexbox o grid. Outlook para Windows ignora el diseño CSS moderno.
• Estilos en línea en cada elemento. Gmail elimina los bloques <style> y los nombres de clase de las firmas.
• Fuentes seguras para la web (Arial, Helvetica, Verdana, Georgia). Una fuente web personalizada se sustituye por Times New Roman en Outlook.
• Imágenes alojadas con atributos width y height. Sin tamaños explícitos, Outlook puede mostrar un logotipo a su tamaño original completo.
• Texto para los teléfonos, correos y enlaces, no imágenes de ellos. Así siguen siendo clicables, se leen con las imágenes desactivadas y son accesibles para los lectores de pantalla.
Los iconos de redes sociales son una trampa habitual: cada icono es otra imagen que hay que alojar y que muchas bandejas de entrada bloquean por defecto. Las plantillas de esta herramienta usan en su lugar pequeñas etiquetas de texto de color, que se ven bien en todas partes.
Cómo elegir una plantilla
La clásica y la moderna sirven para la mayoría de los usos profesionales: una foto o un logotipo junto a tus datos. La compacta está pensada para quienes responden mucho y no quieren un bloque grande bajo cada mensaje. La centrada funciona en puestos creativos donde la firma forma parte de la marca. La de banner da más peso al color de marca. La de solo texto no tiene imágenes ni bloques de color, lo que la convierte en la opción más segura para clientes de texto sin formato, listas de correo y servicios de soporte.
Elijas la que elijas, usa la misma plantilla en todo el equipo. Unas firmas coherentes transmiten intención; una mezcla de estilos da la impresión de que nadie se ocupa de la marca.
Avisos legales y enlaces con seguimiento
Algunas jurisdicciones exigen datos de la empresa en el correo profesional. En el Reino Unido, una sociedad limitada debe mostrar su denominación registrada, su número de registro y la dirección de su domicilio social; en Alemania, las normas del Impressum cubren datos similares. Un aviso de confidencialidad tiene poca fuerza legal por sí solo, así que, si lo usas, que sea breve.
Si añades un botón de llamada a la acción o un enlace a una página de destino, etiquétalo con parámetros UTM (nuestro generador de UTM crea el enlace) para que los clics aparezcan como “email signature” en tu analítica en lugar de como tráfico directo.
Herramientas gratis relacionadas
- Comprobador de palabras spam — Pega el asunto y el cuerpo de un correo para encontrar frases que activan el spam, mayúsculas excesivas, problemas con enlaces e imágenes y la falta de un enlace para darse de baja.
- Probador de asuntos de email — Puntúa un asunto por longitud, palabras que activan filtros de spam, mayúsculas y puntuación, y mira cómo se corta en el iPhone y en Gmail.
- Generador de códigos QR — Crea un código QR para una URL, texto, email, teléfono, SMS, Wi-Fi o tarjeta de contacto, con tus colores, y descárgalo en PNG o SVG. Los códigos no caducan nunca.
- Generador de enlaces UTM — Crea enlaces de seguimiento UTM limpios y coherentes para saber exactamente qué campañas te traen clientes.