Idioma
English English Vietnamese (Tiếng Việt) Vietnamese (Tiếng Việt) Chinese (简体中文) Chinese (简体中文) Portuguese (Brazil) (Português do Brasil) Portuguese (Brazil) (Português do Brasil) Spanish (Español) Spanish (Español) Indonesian (Bahasa Indonesia) Indonesian (Bahasa Indonesia)
Generador de OG Image

Generador de OG Image

Crea imágenes Open Graph de vista previa para compartir enlaces en redes sociales: 20 plantillas, texto y colores a tu gusto, sube imágenes y exporta PNG de 1200x630.

Generador de OG Image para vistas previas de enlaces

Este generador de OG image crea la imagen de vista previa de Open Graph que aparece cuando compartes tu enlace en Facebook, X (Twitter), LinkedIn, Discord, Slack y otras apps. Escribe tu título y los detalles, elige una plantilla y exporta un PNG de 1200×630 perfecto al píxel — sin necesidad de programas de diseño.

Está pensado para cualquiera que publique contenido y quiera que sus tarjetas de enlace luzcan profesionales: blogueros, especialistas en marketing, desarrolladores que configuran la etiqueta og:image y creadores que quieren que cada URL compartida destaque, en vez de mostrar una miniatura genérica o ausente. Elige entre 20 plantillas, personaliza el texto y los colores, suma tus propias imágenes y descárgala en segundos.

Privado por diseño: cada plantilla se renderiza en un lienzo dentro de tu propio navegador. Tu texto y las imágenes que agregues nunca se suben a un servidor — la exportación se genera por completo en tu dispositivo.

Cómo crear tu OG image

1

Ingresa tu contenido

Completa los campos Título, Subtítulo, Autor y Sitio web en el panel Contenido. El lienzo se actualiza en tiempo real a medida que escribes, y tu sitio web también alimenta la simulación de la tarjeta social.

2

Elige una plantilla

Abre la cuadrícula de Plantillas y haz clic en cualquiera de los 20 diseños — degradados, minimalistas, oscuros, retro y más. Cada uno organiza tu texto con su propia composición y estilo.

3

Personaliza los colores

Elige una de las 8 paletas de colores o define tu propio color primario y de acento con los selectores. Las plantillas adaptan sus fondos y acentos para combinar con tu elección.

4

Ubica el texto y agrega imágenes

Arrastra cualquier elemento de texto en el lienzo para reubicarlo, o haz doble clic para saltar directo a su campo de entrada. Usa Agregar en el panel Imágenes para subir fotos o logos, luego arrástralos para moverlos y tira de un controlador de esquina para redimensionar.

5

Exporta tu imagen

Descarga un PNG de 1200×630, o copia la imagen directo al portapapeles para pegarla en otro lugar. Agrégala a tu página con una etiqueta og:image y tu vista previa de enlace queda lista.

Funciones

20 plantillas únicas

Composiciones con degradado, minimalistas, oscuras, retro y creativas, incluyendo Degradado Fluido, Terminal Oscura, Cyberpunk, Polaroid, Periódico, Brutalista y Tarjeta de Vidrio.

Campos de texto personalizables

Define el título, el subtítulo, el autor y el sitio web, con el lienzo actualizándose en vivo mientras escribes cada campo.

Texto que se arrastra

Cada elemento de texto se puede arrastrar libremente por el lienzo, así mantienes el control total de la composición más allá de la posición por defecto de cada plantilla.

Paletas y colores propios

Aplica una de las 8 paletas seleccionadas o define tu propio color primario y de acento; las plantillas recolorean sus fondos y acentos para combinar.

Subida y edición de imágenes

Agrega varias fotos o logos sobre la plantilla, luego arrástralos para moverlos y tira de los controladores de esquina para redimensionar manteniendo la proporción.

Simulación de vista previa social

Una tarjeta de enlace realista muestra tu imagen con el dominio, el título y la descripción, para que veas cómo lucirá el enlace antes de publicarlo.

Vista previa con zoom

Recorre la tarjeta de vista previa por cinco tamaños, desde unos compactos 320px hasta unos amplios 840px, para revisar cómo se ven el texto y las imágenes a cualquier escala.

Exportación PNG y copia

Descarga un PNG de alta calidad de 1200×630 o copia la imagen directo al portapapeles para pegarla en otra app.

Doble clic para editar

Haz doble clic en cualquier texto del lienzo para saltar directo a su campo de entrada en el panel lateral y empezar a editar al instante.

Tecla Supr y modo oscuro

Presiona Supr para eliminar una imagen seleccionada y trabaja a gusto con un tema oscuro integrado.

Preguntas frecuentes

¿Qué es una OG image?

Una imagen Open Graph (OG image) es la imagen de vista previa que aparece cuando se comparte un enlace en redes sociales o apps de mensajería. Se define con la etiqueta og:image en el <head> de tu página y suele ser lo primero que la gente ve en el feed, así que una imagen clara y acorde a tu marca puede subir notablemente los clics.

¿Qué tamaño debe tener una og:image?

El tamaño estándar de una imagen Open Graph es de 1200 × 630 píxeles (proporción 1.91:1), que funciona en Facebook, X, LinkedIn y casi todas las demás plataformas. Este generador exporta exactamente en esa resolución siempre.

¿Cómo agrego la etiqueta og:image a mi sitio?

Sube el PNG exportado a tu sitio y luego agrega esta línea dentro del <head> de tu página:

<meta property="og:image" content="https://tusitio.com/ruta/a/og-image.png">

La mayoría de las plataformas guardan las vistas previas en caché, así que vuelve a compartir o usa el depurador de la plataforma para actualizar la tarjeta después de cambiar la etiqueta.

¿Conviene usar PNG o JPG para una og:image?

Esta herramienta exporta en PNG, que mantiene el texto y los gráficos planos de la plantilla nítidos y es compatible en todas partes. El JPG puede dar un archivo más liviano en diseños con muchas fotos, pero la exportación PNG de aquí está dentro de los límites de tamaño habituales de las plataformas y es la opción más segura para un texto bien definido.

¿Por qué no aparece mi OG image al compartir el enlace?

Las causas más comunes son una etiqueta og:image ausente o incorrecta, una URL de imagen relativa en lugar de absoluta, o una vista previa antigua en caché. Asegúrate de que la etiqueta apunte a una URL https:// completa y luego vuelve a procesar la página en el depurador de vistas previas de la plataforma para limpiar la caché.

¿Puedo subir mis propias imágenes y usar colores propios?

Sí. Haz clic en Agregar para subir una o más fotos o logos, luego arrástralos para moverlos y tira de un controlador de esquina para redimensionar manteniendo la proporción. Para el color, elige una de las 8 paletas o define cualquier color primario y de acento con los selectores, y las plantillas se adaptan para combinar.

¿Cómo reubico el texto sobre la imagen?

Haz clic y arrastra cualquier elemento de texto directamente sobre el lienzo para moverlo, o haz doble clic para saltar a su campo en el panel lateral. Cambiar de plantilla restablece el texto a las posiciones por defecto de esa plantilla.

¿Mis imágenes se suben a un servidor?

No. Todo el renderizado y la exportación ocurren por completo en tu navegador usando el lienzo, y las imágenes que agregas se leen localmente en tu dispositivo. Nada de lo que ingresas o subes se envía a un servidor.

EXAMPLE.COM
Título de la página
La descripción de la página aparecerá aquí...
1200 × 630
Contenido
Imágenes
Colores
#6366f1
#a855f7
Plantillas
El tamaño estándar de una OG image es 1200 × 630 píxeles (proporción 1.91:1)
Arrastra el texto en el lienzo para reubicarlo libremente
Haz doble clic en el texto del lienzo para saltar a su campo de entrada
Usa una paleta de colores para cambiar de tema rápido en todas las plantillas
Sube imágenes y arrastra los controladores de esquina para redimensionar a escala
Presiona Supr para eliminar una imagen seleccionada del lienzo
Agrega el PNG exportado con una etiqueta og:image en el head de tu página
Todo el procesamiento ocurre en tu navegador — las imágenes nunca se suben
¿Quieres aprender más? Leer documentación →
1/9
Comience a escribir para buscar...
Buscando...
No se encontraron resultados
Pruebe con otras palabras clave