# Og Image Design > Diseño de imágenes Open Graph y para compartir en redes, con especificaciones por plataforma, ubicación de texto y branding; cubre meta tags og, Twitter cards, previews de LinkedIn y generación dinámica. Fuente: https://skillsagentes.com/skills/skills-101/superpowers/og-image-design Markdown: https://skillsagentes.com/skills/skills-101/superpowers/og-image-design.md Repositorio: https://github.com/skills-101/superpowers Autor: skills-101 Licencia: no declarada Actualizado: el mes pasado Coste de contexto: 112 tok instalada, 2.6k tok al activarse, 2.6k tok con todos los archivos del bundle Bundle: 1 archivo, 10 KB Permisos que pide: bash(belt *) ## Instalación Un skill son archivos markdown: los mismos archivos valen para cualquier agente y lo único que cambia es el directorio de destino, es decir la bandera `--agent`. Añade `-g` para instalarlo en todos los proyectos de la máquina. ```bash # Claude Code npx -y skills add skills-101/superpowers --skill og-image-design --agent claude-code # Cursor npx -y skills add skills-101/superpowers --skill og-image-design --agent cursor # Codex npx -y skills add skills-101/superpowers --skill og-image-design --agent codex # Gemini CLI npx -y skills add skills-101/superpowers --skill og-image-design --agent gemini # Windsurf npx -y skills add skills-101/superpowers --skill og-image-design --agent windsurf # Cline npx -y skills add skills-101/superpowers --skill og-image-design --agent cline ``` ## Qué hace - Genera imágenes Open Graph con belt app run infsh/html-to-image o falai/flux-dev-lora, con plantillas HTML para blog, lanzamiento de producto y tutorial - Aplica especificaciones por plataforma (Facebook, Twitter/X, LinkedIn, Discord, Slack) para dimensiones, formato y tamaño - Define reglas de diseño: tamaño de texto, zonas seguras de 40px, contraste y fondos oscuros preferidos - Proporciona las etiquetas meta og: y twitter: necesarias y enlaces a herramientas de validación ## Cuándo usarla - Crear imágenes de compartir en redes sociales, miniaturas de blog, previews de enlaces o social cards - Definir o corregir og:image, twitter:card y otras meta etiquetas de una página - Diseñar un sistema consistente de imágenes OG para varias páginas de un sitio o blog ## Qué la activa - "Genera una imagen OG de 1200x630 para mi artículo de blog" - "Ayúdame a escribir las meta etiquetas og:image y twitter:card de mi web" - "Crea una social card oscura para el lanzamiento de mi producto" ## Antes de instalar - Requiere instalar y autenticar el CLI belt de inference.sh (npx skills add belt-sh/cli, belt login). - Necesita en el PATH: npx - makes network requests ## Archivos - SKILL.md — 10 KB ## SKILL.md No se reproduce aquí. Léelo en https://github.com/skills-101/superpowers/blob/main/guides/design/og-image-design/SKILL.md ## Dónde encaja - Categoría: [Diseño y UI](https://skillsagentes.com/categorias/diseno-ui.md) — Sistemas de diseño, trabajo con componentes y acabado visual. - Creador: [skills-101](https://skillsagentes.com/creators/skills-101.md) — 86 skills en el directorio - [Todas las skills](https://skillsagentes.com/skills.md) - [Ranking de instalaciones](https://skillsagentes.com/ranking.md) ## Otras skills del mismo repositorio - [Agent Tools](https://skillsagentes.com/skills/skills-101/superpowers/agent-tools.md): Ejecuta apps de IA vía el CLI de inference.sh: generación de imágenes y video, LLMs, búsqueda web, 3D y automatización de Twitter, con modelos como FLUX, Veo, Gemini, Claude y OpenRouter. - [Ai Avatar Video](https://skillsagentes.com/skills/skills-101/superpowers/ai-avatar-video.md): Crea videos de avatares IA y talking heads con el CLI de inference.sh: P-Video-Avatar (TTS integrado), OmniHuman, Fabric, PixVerse, para presentadores, dobleaje, UGC y avatares de juegos. - [Ai Image Generation](https://skillsagentes.com/skills/skills-101/superpowers/ai-image-generation.md): Genera imágenes con IA usando GPT-Image-2, FLUX, Gemini, Grok, Seedream, Reve y más de 50 modelos vía el CLI de inference.sh. - [Ai Music Generation](https://skillsagentes.com/skills/skills-101/superpowers/ai-music-generation.md): Genera música y canciones con IA usando ElevenLabs, Diffrythm y Tencent Song Generation vía el CLI de inference.sh, para fondos musicales, redes sociales, podcasts y bandas sonoras. - [Ai Video Generation](https://skillsagentes.com/skills/skills-101/superpowers/ai-video-generation.md): Genera videos con IA usando Google Veo, Seedance 2.0, HappyHorse, Wan, Grok y más de 40 modelos a través del CLI de inference.sh. ## Skills relacionadas - [Ai Image Generation](https://skillsagentes.com/skills/skills-101/superpowers/ai-image-generation.md): Genera imágenes con IA usando GPT-Image-2, FLUX, Gemini, Grok, Seedream, Reve y más de 50 modelos vía el CLI de inference.sh. - [Ai Product Photography](https://skillsagentes.com/skills/skills-101/superpowers/ai-product-photography.md): Genera fotografía de producto y comercial con IA usando FLUX, Imagen 3, Grok y Seedream: tomas de estudio, escenas lifestyle, packaging y fotos para e-commerce. - [App Store Screenshots](https://skillsagentes.com/skills/skills-101/superpowers/app-store-screenshots.md): Creación de screenshots para App Store y Google Play con specs exactas de plataforma: dimensiones iOS/Android, orden de galería, mockups de dispositivo y vídeos de preview. - [Background Removal](https://skillsagentes.com/skills/skills-101/superpowers/background-removal.md): Elimina fondos de imágenes con BiRefNet vía el CLI de inference.sh; útil para fotos de producto, retratos, e-commerce, PNGs transparentes y edición fotográfica. - [Book Cover Design](https://skillsagentes.com/skills/skills-101/superpowers/book-cover-design.md): Diseño de portadas de libros con convenciones por género, reglas de tipografía y generación de imágenes con IA, para autopublicación, ebooks, impresos y audiolibros. --- Skills Agentes · [Índice de páginas en markdown](https://skillsagentes.com/sitemap.md) · [Inicio](https://skillsagentes.com/index.md)