Generador de Imágenes Open Graph Gratis

Crea fácilmente impresionantes imágenes OG, encabezados para Twitter/X y más con solo unos clics, sin necesidad de habilidades de diseño. Asegura la mejor visualización en plataformas como Twitter, Facebook y LinkedIn usando formatos PNG (recomendado), JPEG o WebP. ¿Necesitas automatización? Genera imágenes Open Graph al instante con nuestra potente API.

Choose a template

Propiedades de la Plantilla
Personaliza tu imagen cambiando las propiedades.
Fondo
Establece un fondo personalizado para tu imagen.
Dirección del Gradiente
Superposición de Cuadrícula
0.15
Preview
Formatos de Imagen Óptimos para Open Graph
Elige el mejor formato de imagen para compartir en redes sociales.
  • PNG: Ofrece calidad superior para texto y logos.
  • JPEG: Ideal para fotos e imágenes con colores complejos.
  • WebP: Un formato moderno que proporciona excelente compresión manteniendo alta calidad.
Descargar Imagen
Exporta tu imagen en formato PNG, JPEG o WebP.

Para la mejor visualización de imágenes Open Graph (OG) en plataformas como Twitter, Facebook y LinkedIn, se recomienda usar formatos PNG (preferido), JPEG o WebP.

Integración API
Genera imágenes Open Graph al instante usando nuestra API.

Copia el cuerpo de la solicitud como JSON o un comando cURL.

Añadir Imágenes Open Graph es Fácil

Añade fácilmente imágenes de vista previa para redes sociales a tu sitio web en solo minutos. Selecciona tu método preferido a continuación, ya sea usando HTML o Next.js App Router.

1. Guarda la imagen

Guarda tu imagen OG generada como og.png en el directorio raíz de tu sitio web.

2.Generar y añade la Etiqueta Open Graph al head HTML

<!-- Basic OG Tags -->
<meta property="og:title" content="Your Page Title" />
<meta property="og:description" content="Your page description" />
<meta property="og:image" content="https://yourdomain.com/og.png" />
<meta property="og:url" content="https://yourdomain.com" />

<!-- Twitter/X Card Tags -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:image" content="https://yourdomain.com/og.png" />

<!-- Optional but recommended -->
<meta property="og:type" content="website" />
<meta property="og:site_name" content="Your Site Name" />

Asegúrate de reemplazar yourdomain.com con tu nombre de dominio real.

Consejos de Expertos

  • Siempre ten imágenes de respaldo en caso de que la imagen OG no se cargue.
  • Usa herramientas de depuración de redes sociales para probar tus imágenes OG.
  • Añade texto alternativo significativo para mejorar la accesibilidad.
  • Opta por imágenes OG dinámicas para contenido actualizado frecuentemente.