Generador Gratuito de Imágenes Open Graph
Este generador gratuito de imágenes Open Graph crea un PNG de 1200 por 630 píxeles para la imagen que aparece cuando tu enlace se comparte en Facebook, LinkedIn, WhatsApp o X. Escribe un título y subtítulo, elige tu color de marca y una plantilla, luego descarga el archivo y configúralo como og:image. Sin registro y nada de lo que escribas se almacena.
Open Graph Image Generator
Images
Sobre esta herramienta
Cuando alguien pega tu enlace en un chat o una publicación social, la imagen de vista previa decide si hace clic. Las páginas sin imagen Open Graph muestran un cuadro en blanco o un recorte aleatorio. Un título claro sobre un fondo limpio en tu color de marca es una solución rápida y consistente para publicaciones de blog, páginas de herramientas y páginas de destino que no tienen su propia foto.
Escribe el título de la página, un subtítulo opcional y el nombre de tu sitio, elige un color y una de cuatro plantillas: color sólido, degradado, claro con barra de acento u oscuro. El color del texto se elige automáticamente para que siga siendo legible sobre tu color, y los títulos largos se ajustan y se reducen para caber en tres líneas como máximo. Los títulos de unos 60 caracteres o menos se ven mejor. La imagen se dibuja con las fuentes Inter y Outfit que utiliza este sitio.
Después de descargar el PNG, cárgalo en tu sitio y apunta la etiqueta meta og:image a su dirección completa, y añade una etiqueta twitter:image coincidente. Mantén las palabras importantes alejadas de los bordes, porque algunas aplicaciones recortan los lados. La fuente cubre letras latinas, números y puntuación común; los emoji y otros scripts se eliminan. Puedes verificar las etiquetas en vivo después con el verificador Open Graph.
Preguntas frecuentes
¿Qué tamaño debe tener una imagen Open Graph?
El tamaño ampliamente utilizado es 1200 por 630 píxeles, una proporción de aproximadamente 1,91 a 1. Facebook, LinkedIn, WhatsApp y X la muestran bien. Mantén el archivo por debajo de unos pocos megabytes, usa una dirección web completa en la etiqueta og:image y mantén el texto importante alejado de los bordes.
¿Cómo uso la imagen en mi sitio web?
Carga el PNG descargado en tu sitio, luego añade una etiqueta meta en el head de la página: og:image con la dirección completa del archivo. Añade una etiqueta twitter:image con la misma dirección para X. La mayoría de sistemas de gestión de contenidos también tienen un campo para esto en su configuración SEO.
¿Por qué sigue mostrándose mi vista previa antigua después de cambiarla?
Las redes sociales almacenan en caché las vistas previas de enlaces. Después de actualizar la imagen, usa el Depurador de Compartición de Facebook o el Inspector de Publicaciones de LinkedIn para volver a obtener la página. Darle al nuevo archivo un nombre diferente también ayuda, porque la dirección entonces parece una imagen nueva para el caché.
¿Puedo usar mi propio logo o foto?
Este generador dibuja solo texto sobre color, por lo que no tiene carga de logo o foto. Es adecuado para sitios que necesitan una tarjeta limpia y consistente rápidamente. Para un diseño con foto o logo, usa una herramienta de diseño y expórtalo a 1200 por 630 píxeles.
¿Se almacena algo de lo que escribo?
No. Tu título, subtítulo y color se utilizan para dibujar la imagen y no se guardan. El PNG aparece en el resultado como una descarga y existe solo en tu página del navegador, así que guárdalo antes de recargar o abandonar la página.