Generador de imágenes OG
Crea una imagen Open Graph 1200×630 para vistas previas de enlaces en blogs, landing pages y lanzamientos de producto.
Tamaño de exportación recomendado
1200×630 px
Plantillas recomendadas
Cada una se abre en el editor con este formato aplicado. Ver todas las plantillas
Hero Split
Creator covers, launches, personal branding
Full Image Split
Visual-first covers with a full-bleed image split
Split CTA
Launch posts with a headline and clear call to action
Video Split
Keynote and talk covers with a wide side media panel
Stagger Split
Product stories with a staggered four-card media stack
Communication Pad
Brand-led stories with a hero image and supporting copy
Left Image
Visual-led covers with copy and a clear CTA on the right
Tilted Image
Playful launches with a tilted product visual
Card Split
Offer and launch cards with a bordered white panel and shadow
Diagonal Split
Bold launches with a diagonal text-and-image cut
Clean Editorial
Essays, newsletters, thought leadership
Tutorial Card
Tutorials, guides, how-to content
Data Report
Reports, trends, analysis
Product Update
Product launches, updates, release notes
Creator Bold
Social posts, creator content
Cómo funciona
- Abre el generador de imágenes OG con el formato Open Graph fijado en 1200×630.
- Elige una plantilla que encaje con la página que vas a compartir (layouts centrados en texto o divididos).
- Edita el título y el subtítulo, y ajusta el fondo, el contraste y las imágenes opcionales.
- Exporta PNG, JPEG o WebP, sube el archivo a tu sitio y define og:image con esa URL.
Buenas prácticas
- Apunta a unos 1200×630 px, el tamaño habitual para vistas previas enriquecidas de enlaces.
- Mantén el titular lo bastante corto para leerse en miniatura en feeds y chats.
- Usa contraste fuerte; las plataformas suelen recomprimir las imágenes con fuerza.
- Pon las palabras clave en la primera mitad del título por si se recortan los bordes.
- Reutiliza una misma familia de layouts en tus publicaciones para que los shares se sientan de marca.
- Tras subir el archivo, define og:image (y twitter:image) con la URL pública final, no con una ruta local.
- Vuelve a comprobar la vista previa en Slack o LinkedIn tras cambiar la imagen; algunas cachés conservan la tarjeta antigua hasta actualizarse.
Implement Open Graph images in your website
After you generate an OG image, upload the file to a public path on your site and set og:image (and usually twitter:image) to that URL. Link previews then show your title, description, and graphic across social platforms and messengers.
<!-- Basic Open Graph 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-image.png" />
<meta property="og:url" content="https://yourdomain.com/page" />
<meta property="og:type" content="website" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:image" content="https://yourdomain.com/og-image.png" />Preguntas frecuentes
Guías relacionadas
Aprende más sobre tamaños, buenas prácticas y formas de crear mejores imágenes para este formato.
- How-to guides
How to Create an Open Graph Image
Learn how to create an Open Graph image for blog posts, landing pages, product launches, and social shares. Use templates to design a clean link preview image online.
- Design ideas
Open Graph Image Examples
Explore Open Graph image examples for blog posts, landing pages, product launches, and social shares. Learn what makes a better link preview image.
- Size guides
Open Graph Image Size: 1200×630 for Link Previews
OG image size cheat sheet: 1200×630 px (~1.91:1). Cropping tips for Slack, LinkedIn & Meta—plus a free OG generator preset that exports the right canvas.
Crea tu próxima imagen destacada
Empieza con un formato, elige una plantilla y exporta una imagen limpia en minutos.
