# Og Image

> Design Open Graph / social share images (1200x630) that render well in link previews - on-brand, legible, correctly exported. Use when a page or post needs a share/preview image.

- **Type:** Skill
- **Install:** `agentstack add skill-m-binimran-design-pack-og-image`
- **Verified:** Yes — security-reviewed for prompt injection and unsafe behavior
- **Seller:** [m-binimran](https://agentstack.voostack.com/s/m-binimran)
- **Installs:** 0
- **Category:** [Content & Media](https://agentstack.voostack.com/c/content-and-media)
- **Latest version:** 0.1.0
- **License:** MIT
- **Upstream author:** [m-binimran](https://github.com/m-binimran)
- **Source:** https://github.com/m-binimran/design-pack/tree/main/skills/og-image

## Install

```sh
agentstack add skill-m-binimran-design-pack-og-image
```

Requires the [AgentStack CLI](https://agentstack.voostack.com/docs/cli). Works with Claude Code, Cursor, and any MCP-compatible agent.

## About

# og-image

The image that represents a link everywhere it's shared. Small, legible, on-brand.

## Process
1. **Canvas 1200x630** (1.91:1). Keep key content centered - platforms crop edges differently.
2. **Hierarchy:** a short headline (large, legible), optional supporting line, logo, a simple background or
   hero. Don't cram - it renders small.
3. **Build** via Canva (branded) or `image-generate` for the background, then place text.
4. **Contrast:** text must pass over the background (the `contrast-guard` hook) - add a scrim if needed.
5. **Export** optimized PNG/JPG (< ~1MB), absolute-URL ready; name kebab-case.

## Output
- The OG image (confirmed from the connector) + the exact dimensions and the optimized file, ready to wire to `og:image`.

## Guardrails
- Legible at small size; safe margins; on-brand. Optimized weight.
- Verify it actually renders in a preview tester before claiming done; confirm connector output is real.

## Source & license

This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.

- **Author:** [m-binimran](https://github.com/m-binimran)
- **Source:** [m-binimran/design-pack](https://github.com/m-binimran/design-pack)
- **License:** MIT

Install and usage instructions live in the source repository linked above.

## Pricing

- **Free** — Free

## Security capabilities

Automated source analysis of v0.1.0 — what this tool can access:

- **Network access:** no
- **Filesystem access:** no
- **Shell / process execution:** no
- **Environment & secrets:** no
- **Dynamic code execution:** no

*"Yes" means the capability is present in the source — more access means more to trust, not that it is unsafe.*


## Versions

- **0.1.0** — security scan: passed — Imported from the upstream source.

## Links

- Listing page: https://agentstack.voostack.com/l/skill-m-binimran-design-pack-og-image
- Seller: https://agentstack.voostack.com/s/m-binimran
- Browse the marketplace: https://agentstack.voostack.com/browse

---
Listed on AgentStack — the marketplace for AI agent skills and MCP servers. Every listing is security-reviewed. Creators keep 70%.