Social Platform OG Image
Una vista previa para compartir que gana el clic en una fracción de segundo.
Convierte tu IA en un diseñador de vistas previas sociales: crea una imagen para compartir de 1200×630 para cualquier página: un motivo llamativo, una promesa corta y una tipografía que se mantiene legible en tamaño miniatura.

Instálala en 3 pasos
Sin registro. Sin herramientas CLI. Elige tu IA, copia una línea y pégala.
¿Prefieres hacerlo tú mismo? Compra la habilidad ($4.99), descarga el ZIP desde la confirmación de compra, descomprímelo en el directorio que se muestra arriba y reinicia tu sesión de IA — el mismo resultado. ¿Ya la compraste? Tu asistente de IA puede descargarla por ti.
Qué incluye
Un SKILL.md (la guía paso a paso) + una plantilla inicial. Una vista previa:
Social Platform OG Image
When to use
- A page's link preview on social platforms currently shows a blank box, a cropped screenshot, or an auto-generated thumbnail
- You are launching a product, article, or event and want the shared link to look deliberate instead of accidental
- A homepage, pricing page, or docs page gets shared often and the preview does not say what the page is
- Your site has many pages and you need one repeatable preview format that works across all of them
- You are redesigning a brand and the social previews still show the old look
Workflow
- Decide the one message (input: the page → output: a one-line message)
A preview image gets a fraction of a second at thumbnail size, so it carries exactly one message: the page's core promise in eight words or fewer. Read the page, then write the sentence a friend would use to describe it: "A waitlist app for launch teams," not "Welcome to our homepage." If the page has no single promise — a sprawling dashboard, a sitemap — the preview should carry the brand promise instead. One message, eight words, no exceptions. - Pick the motif (input: the one-line message → output: a single visual motif)
Choose one visual idea that carries the message without words: a single product mark, one oversized icon, one abstract shape, one cropped product shot. The motif occupies roughly a third to a half of the canvas and sits on a flat, high-contrast background. Resist the collage instinct — three screenshots, four icons, and a photo do not compress into a thumbnail; they compress into noise. The test is simple: at the size of a postage stamp, can a stranger still tell what the image is about? - Set the type (input: message + motif → output: the type layout)
Set the message in one large, bold typeface at a size that stays legible when the image is shown 240 pixels wide — in practice, that means very few words at very large sizes, with generous line spacing. Put a small brand mark or site name in one corner, small enough to read but never competing with the message. Keep all text inside a safe margin (at least 60 pixels from every edge at 1200×630) because platforms crop previews differently. Never put essential text in the bottom strip — several platforms overlay play buttons or domain labels there. - Build to spec (input: type layout + motif → output: a finished 1200×630 image)
Produce the image at exactly 1200×630 pixels, exported as a JPEG or PNG under 1 MB so it loads fast in crawlers. Use flat colors and crisp vector shapes rather than photographic detail — fine textures and thin lines turn to mush at thumbnail size. Check contrast between text and background: dark text on a light field or light text on a dark field, never mid-tone on mid-tone. Export once at full size and once at 240 pixels wide to verify the thumbnail read. - Verify the preview (input: finished image → output: a confirmed working preview)
Wire the image into the page's social meta tags (the Open Graph image tag and its width/height companions) and check it with the platform's own link debugger or by pasting the link into a fresh post draft. Confirm three things: the image actually appears (not a cached old one), it is not cropped into unreadability, and the title and description beside it match the image's message. If a stale preview persists, it is usually a cache — re-scrape the URL through the debugger rather than rebuilding the image.
Vista previa de la plantilla
Social Platform OG Image — Design Template
One image, one message, readable at thumbnail size.
Page being previewed
URL: {page URL} Page's core promise (in one sentence): {what the page offers}
Message (≤8 words)
Preview message: {the one line that appears on the image}
Why this line: {what it promises the reader}
Motif (one visual idea)
Motif: {single mark / icon / shape / cropped product shot}
Background: {flat color — high contrast with the type}
Composition: {motif placement: e.g. "mark on the right third, type on the left two-thirds"}
Type
Typeface: {one bold typeface}
Message size: {large — legible at 240 px wide}
El paquete de la habilidad (SKILL.md + plantilla) está escrito en inglés.


