Generador de imágenes OG — Creador de imágenes para compartir en redes sociales

Una imagen Open Graph es la imagen que aparece cuando se pega un enlace en un chat, un tuit o un canal de Slack — y todas las plataformas que renderizan una esperan un canvas de aproximadamente 1200×630 píxeles, el tamaño para el que se diseñaron tanto las tarjetas og:image de Facebook como las summary_large_image de Twitter. Si el tamaño no es el correcto, la imagen sale recortada, borrosa o deformada; si la composición falla, el título se muestra como una astilla ilegible sobre una foto recargada. Esta herramienta compone la imagen a la resolución real de destino usando la API Canvas 2D, de modo que lo que ves en la vista previa es exactamente la cuadrícula de píxeles que se exporta en el PNG.

Elige un fondo — un color plano, un gradiente lineal de dos paradas construido con los dos colores que elijas, o una foto subida que se recorta para rellenar el marco completo de 1200×630 igual que lo haría un background-size: cover de CSS, en lugar de estirarse y deformarse. Escribe un título y un subtítulo opcional: ambos se miden carácter por carácter con las métricas de fuente propias del canvas, de modo que un titular demasiado largo para caber en una línea se reparte en una segunda o tercera línea en un punto de corte real entre palabras, en vez de desbordarse o ser truncado sin aviso. Elige alineación centrada o a la izquierda, escoge un color de texto que se lea bien sobre tu fondo, y coloca un logo opcional en la esquina a un tamaño fijo y legible.

Debajo del canvas, cuatro pequeñas tarjetas aproximan el aspecto de la imagen final una vez que una plataforma real la envuelve en su propio marco: la tarjeta de Twitter/X muestra solo el dominio y un título en negrita debajo de la imagen, sin línea de descripción; Facebook añade una franja de dominio en mayúsculas sobre un bloque de título y descripción; LinkedIn coloca el dominio debajo del título, sin descripción alguna; y la incrustación de Discord sitúa el dominio, el título y la descripción encima de la imagen, con su propio tema oscuro. Son aproximaciones estilizadas para fines de planificación — claramente etiquetadas como ilustrativas, con una línea de dominio que tú mismo escribes —, no una captura en vivo ni una captura de pantalla de las plataformas reales, ya que es al compartir el enlace y dejar que el rastreador de cada plataforma lea las etiquetas meta og:image y og:title reales de tu página como se genera la tarjeta en vivo.

Todo se renderiza localmente en un elemento canvas HTML en tu navegador: el título, el subtítulo, el fondo y el logo subido nunca abandonan tu dispositivo, y el archivo exportado es un PNG limpio vía canvas.toBlob() que contiene únicamente lo que has compuesto — sin marcos de simulación, barras falsas de navegador ni logos de plataformas incrustados en la imagen descargada. Si después necesitas redimensionar o convertir el PNG exportado, las herramientas redimensionador de imágenes y conversor de imágenes de este sitio continúan justo donde esta lo deja.