Las imágenes no salen de tu dispositivo
No se requiere cuenta
Edición en tiempo real
PNG / SVG recomendado
¿Qué es el generador de imágenes OG?
Las imágenes OG (Open Graph) son imágenes de vista previa que se muestran cuando se comparten páginas web en redes sociales como Twitter/X, Facebook, LINE y LinkedIn. Las imágenes OG atractivas aumentan significativamente la tasa de clics (CTR) y el tráfico desde las plataformas sociales.
Esta herramienta permite crear imágenes OG profesionales completamente gratis en tu navegador sin necesidad de registro. Cuenta con más de 20 plantillas, fondos degradados, soporte para fuentes multilingües, colocación de logotipos y salida en el tamaño recomendado de 1200×630px.
Características principales
- 🎨 20+ plantillas profesionales (tecnología, blog, marketing, etc.)
- 📝 8 fuentes incluyendo Inter, Roboto y fuentes japonesas
- 🌈 30+ presets de fondos degradados
- 🖼️ Carga de logotipo e imagen de fondo
- 📱 Vista previa de Twitter/Facebook
- 🏷️ Código HTML de meta etiquetas OGP generado automáticamente
- 🔒 Todo el procesamiento ocurre en tu navegador (privacidad protegida)
Cómo crear una imagen OG
Paso 1: Elegir plantilla
Selecciona una plantilla según tu propósito. Filtra por categoría: tecnología, blog, marketing y más.
Paso 2: Personalizar
Edita el título, fondo, logotipo y decoraciones. Las fuentes y colores son totalmente personalizables.
Paso 3: Descargar
Descarga en formato PNG/JPEG/WebP. También obtén las meta etiquetas OGP.
¿Qué es OGP (Open Graph Protocol)?
OGP (Open Graph Protocol) es un estándar de metadatos propuesto por Facebook que define cómo se muestra la información de una página web cuando se comparte en redes sociales.
Meta etiquetas OGP principales
| Etiqueta | Descripción | Recomendado |
|---|---|---|
og:title | Título de la página | 30-60 caracteres |
og:description | Descripción de la página | 80-120 caracteres |
og:image | URL de la imagen OG | 1200×630px |
og:url | URL de la página | URL canónica |
og:type | Tipo de contenido | website / article |
twitter:card | Tipo de tarjeta Twitter | summary_large_image |
Tamaños recomendados de imágenes OG
| Plataforma | Tamaño recomendado | Relación de aspecto |
|---|---|---|
| 1200×630px | 1.91:1 | |
| Twitter / X | 1200×630px | 1.91:1 |
| LINE | 1200×630px | 1.91:1 |
| 1200×627px | 1.91:1 |
Preguntas frecuentes
- P. ¿Cuál es el tamaño recomendado para imágenes OG?
- R. 1200×630px es el estándar de la industria. Se muestra de forma óptima en Facebook, Twitter, LINE y LinkedIn.
- P. ¿Dónde coloco la imagen generada?
- R. Súbela a tu servidor y especifica la URL de la imagen en la etiqueta <meta property="og:image">. Usa la sección "Generador de meta etiquetas OGP" para obtener el código.
- P. ¿Se envían datos a un servidor?
- R. No. Todo el procesamiento se realiza completamente en tu navegador. No se transmiten imágenes ni texto.
- P. ¿Qué es Twitter/X Summary Large Image?
- R. Es un formato que muestra una tarjeta con imagen grande al compartir un enlace. Establece twitter:card como summary_large_image para activarlo.
- P. ¿Debo usar JPEG o PNG?
- R. JPEG es mejor para fotos y degradados (menor tamaño). PNG es mejor para imágenes con texto o ilustraciones (texto más nítido).
Casos de uso de imágenes OG
Artículos de blog
Imágenes OG con títulos e insignias de categoría mejoran la tasa de clics en redes sociales.
E-Commerce
Imágenes OG con nombre del producto y logotipo aumentan el reconocimiento de la marca.
Promoción de eventos
Imágenes OG visuales con fecha y ubicación aumentan la asistencia a eventos.
Portafolio
Imágenes OG profesionales con títulos y autor fortalecen la impresión del portafolio.
- Bingo Online Gratis | Voz, Tarjetas y Personalización | Sin App
- Ruleta Online Gratis — Sin Descarga, Sin Instalación | Personalizable
- ¡Sin App! Contador BPM Tap Tempo | Calculadora de Delay y Metrónomo
- Generador de Equipos Aleatorios | Grupos Equilibrados con Niveles de Habilidad
- Generador de Llaves de Torneo | Crear Cuadros y Tablas de Liga
- Desarrollo Web
- Conversor de Código de Color (HEX/RGB/HSL/CMYK) y Paletas
- Generador de CSS Box-Shadow｜Multicapa y Presets
- Generador CSS Clip-Path｜Editor Visual con Presets
- Generador de Animaciones CSS｜Salida de código @keyframes
- Generador de Gradientes CSS｜Lineal, radial y cónico con patrones CSS
- Generador de Animación Sprite CSS｜Código steps() Automático
- Herramienta de Subconjunto de Fuentes｜Reduce Fuentes Web para Sitios Más Rápidos
- Generador de Imágenes Responsivas｜HTML srcset y picture Element Automático
- Verificador de Encabezados HTTP y Auditoría de Seguridad
- Red
- Seguridad
- Procesamiento de Imágenes y Análisis de Texto
- Corrector de Escritura Japonesa | Herramienta Gratuita de Corrección
- Corrector de Mojibake — Conversor de Codificación Gratis
- Generador de formas SVG｜Ondas y blobs SVG con código CSS
- Contador de Caracteres y Palabras | Herramienta Gratuita de Análisis de Texto
- Lector de Texto a Voz | Herramienta TTS Gratuita – Sin límite ni registro