Generador de imágenes OG online gratis
Crea imágenes de vista previa Open Graph de 1200×630 para Facebook, LinkedIn, X y Slack. Elige entre 16 plantillas personalizables y descarga en JPG o PNG.
100% privado. No se sube nada.
Funciones principales
16 plantillas listas para usar
Vista previa en vivo mientras escribes
- 100% basado en navegador — Sin subidas de archivos
- Gratis — No se requiere cuenta
Cómo crear una imagen OG en 3 pasos
Introduce tu contenido
Presiona Abrir editor de imagen OG, luego escribe tu Título, Descripción y Nombre del sitio. La vista previa se actualiza mientras escribes.
Elige una plantilla y un color de marca.
Elige una de las 16 plantillas, como Clean, Dark, Gradient o Grid (Light). La mayoría toman tu Color de marca. Agrega un logo o una foto de fondo en Imagen personalizada si quieres.
Descarga tu imagen
En Exportar, elige JPG o PNG, luego presiona Descargar JPG o Descargar PNG. El archivo siempre es de 1200×630 px, el tamaño estándar de imagen Open Graph.
Cuando necesitas una imagen OG personalizada
Blog y contenido
- Crea una vista previa personalizada para cada entrada del blog antes de publicarla.
- Crea imágenes OG a juego para tus páginas de documentación
- Diseña vistas previas consistentes para páginas de archivo de newsletter
- Haz que los enlaces de tus artículos destaquen en X, LinkedIn y Slack
Productos y SaaS
- Crea una vista previa de marca para cada página de funciones
- Crea imágenes OG para publicaciones de changelog y lanzamientos
- Crea tarjetas para páginas de precios, acerca de y registro
- Diseña vistas previas para cada landing page de campaña
Desarrolladores y agencias
- Prueba el diseño de una tarjeta antes de construir un generador dinámico
- Crea una imagen OG de respaldo para páginas que no tienen una propia
- Crea tarjetas de clientes con su color de marca y su logo
- Prueba varias versiones de titular en paralelo
¿Qué es una imagen Open Graph (OG)?
Una imagen Open Graph, o imagen OG, es la foto que aparece cuando alguien comparte un enlace a tu página en Facebook, LinkedIn, X, Slack y apps similares. Se define con la etiqueta og:image en el HTML de la página. Una imagen de publicación en redes sociales es distinta: esa la subes tú mismo a una sola plataforma.
Tamaño, formato y pruebas de la imagen Open Graph
Una buena imagen OG tiene el tamaño correcto, pesa lo suficientemente poco para cargar rápido y es fácil de leer en tamaño de teléfono. Estas respuestas te ayudan a acertar en cada parte.
¿Cuál es el mejor tamaño para una imagen Open Graph?
Usa 1200×630 px, una proporción 1.91:1, que funciona en todas las plataformas principales. Ese es el tamaño que genera esta herramienta. Cada plataforma tiene sus propios límites:
- Facebook: al menos 1200×630 para vistas previas nítidas. Por debajo de 600×315, el enlace muestra una imagen pequeña en lugar de una grande. Los archivos pueden pesar hasta 8 MB.
- LinkedIn: al menos 1200×627 a 1.91:1, hasta 5 MB.
- X: las tarjetas grandes usan una proporción 2:1, por lo que una franja delgada arriba y abajo de una imagen de 1200×630 puede recortarse. Los archivos deben pesar menos de 5 MB.
¿JPG o PNG: cuál es el mejor formato para una imagen OG?
JPG es la opción predeterminada aquí y mantiene la mayoría de las tarjetas livianas. El control de calidad va del 50% al 95%, y el tamaño estimado se pone verde por debajo de 200 KB. PNG conserva cada píxel, pero puede llegar a 500 KB o más. ¿Ya tienes una imagen terminada? Usa el preset de Publicación de Facebook (1200×630) en el redimensionador de imágenes en su lugar.
¿Logo o fondo: cómo deberías agregar tu propia imagen?
Elige el Modo de imagen en Imagen personalizada. Acepta archivos JPG, PNG, WebP y SVG.
- Logo (superpuesto): tu imagen se ubica en la esquina inferior izquierda de la plantilla que elegiste, con unos 80 px de alto.
- Fondo (relleno): tu foto cubre toda la tarjeta y se recorta para ajustarse. Los bordes se oscurecen ligeramente, y el texto se ubica sobre una barra oscura en la parte inferior.
- El modo de fondo usa su propio diseño de texto, así que la plantilla que elegiste no cambia el resultado.
¿Qué hace buena a una imagen OG?
La mayoría de las personas ve tu tarjeta en tamaño de teléfono, así que mantén el título corto y contundente. Las plantillas muestran entre 65 y 70 caracteres del título y entre 110 y 120 de la descripción, y cortan el resto. Mantén las palabras clave alejadas de los bordes, ya que algunas apps las recortan. Usa la misma plantilla y Color de marca en cada página para que los lectores reconozcan tus enlaces.
¿Cómo pruebas tu imagen OG?
Publica la página y luego pega su URL en el Sharing Debugger de Facebook o en el Post Inspector de LinkedIn. Ambos muestran la tarjeta y obtienen una copia actualizada. Para X, pega el enlace en una publicación nueva: la vista previa de la tarjeta aparece sin necesidad de publicar. Si sigue apareciendo una imagen antigua, sube la nueva con un nombre de archivo diferente y actualiza la etiqueta.
Más herramientas de diseño y generación
Genera, convierte y diseña, todo gratis y en tu navegador.
Generador de capturas de pantalla
Crea capturas de pantalla para app stores con mockups de dispositivos.
Generador de favicon
Exporta favicons en todos los tamaños comunes a partir de una imagen.
Generador de códigos QR
Crea códigos QR para enlaces, texto plano, accesos WiFi o vCards.
Imagen a Base64
Codifica las imágenes como URL de datos Base64 para su incrustación en HTML y CSS.
Generador de imágenes OG: Preguntas frecuentes
Preguntas frecuentes sobre la creación de imágenes Open Graph en línea
¿Cuál es el tamaño correcto de la imagen OG?
Usa 1200×630 píxeles, una proporción 1.91:1. Esta herramienta siempre exporta en ese tamaño exacto. Facebook necesita al menos 600×315 para mostrar una vista previa grande, y LinkedIn pide al menos 1200×627. Una imagen de 1200×630 funciona en Facebook, LinkedIn y X, y en la mayoría de las apps de chat que muestran vistas previas de enlaces.
¿Qué tamaño tiene la imagen de una tarjeta de Twitter (X)?
La tarjeta de imagen grande de X usa una proporción 2:1, al menos 300×157 px y menos de 5 MB. Una imagen OG de 1200×630 también funciona ahí, aunque X puede recortar una franja delgada arriba y abajo. X lee og:image cuando no hay una etiqueta twitter:image. Para obtener la tarjeta grande, agrega también <meta name="twitter:card" content="summary_large_image" /> a tu página.
¿Este generador agrega las meta etiquetas a mi sitio web?
No. Solo crea el archivo de imagen. Tú subes el archivo a tu sitio y agregas la etiqueta og:image tú mismo, como se muestra en la última pregunta a continuación. Muchos constructores de sitios web y plataformas de blogs también tienen un campo de imagen social o para compartir donde puedes subirla en su lugar.
¿Qué fuentes e idiomas admite la imagen OG?
Cada plantilla usa la fuente Inter en regular y negrita. El editor carga solo el conjunto de caracteres latinos de Inter, así que funcionan el inglés y la mayoría de los idiomas de Europa occidental. El texto en chino, japonés, coreano, árabe y cirílico no se mostrará correctamente. No puedes subir tu propia fuente.
¿Puedo usar estas imágenes originales con fines comerciales?
Sí. Las imágenes que creas son tuyas para usar en sitios personales y comerciales, sin marca de agua ni crédito necesario. La fuente Inter tiene licencia SIL Open Font License, que permite el uso comercial. Si agregas un logo o foto, asegúrate de tener el derecho de usarlo.
¿Cómo puedo añadir una imagen OG a mi sitio web?
Sube la imagen descargada a tu sitio o CDN, luego agrega la etiqueta meta og:image dentro del <head> de tu página: <meta property="og:image" content="https://tudominio.com/og/nombre-pagina.jpg" />. Usa la URL completa, comenzando con https. Agrega también las etiquetas og:image:width y og:image:height con los valores 1200 y 630. Después de publicar, usa el Sharing Debugger de Facebook y el Post Inspector de LinkedIn para actualizar la vista previa en caché.