# ogimagecn

> A collection of beautifully designed and customizable Open Graph image components. Built on Satori. Works with shadcn/ui. Use this index to discover the available documentation pages, markdown mirrors, and registry resources before browsing.

## Docs

- Get Started
  - [Introduction](https://www.ogimagecn.com/docs.md): ogimagecn is a shadcn registry of beautiful Open Graph image components built on Satori.
  - [Installation](https://www.ogimagecn.com/docs/installation.md): Install an ogimagecn component and render it as an Open Graph image.
  - [MCP](https://www.ogimagecn.com/docs/mcp.md): Learn how to use the shadcn MCP (Model Context Protocol) server with ogimagecn.
  - [Registry](https://www.ogimagecn.com/docs/registry.md): Learn how to use the ogimagecn registry with the shadcn CLI.
- Components
  - [Components](https://www.ogimagecn.com/docs/components.md): Here you can find all the Open Graph image components available in the library.
  - [Simple](https://www.ogimagecn.com/docs/components/simple.md): A minimal, centered Open Graph image with an eyebrow label, title, description, and brand mark.
  - [Grid](https://www.ogimagecn.com/docs/components/grid.md): A framed, technical Open Graph image with a dashed border grid and a corner brand mark.
  - [Blog](https://www.ogimagecn.com/docs/components/blog.md): An article Open Graph image with a category badge, headline, excerpt, and author row.
  - [Changelog](https://www.ogimagecn.com/docs/components/changelog.md): A release Open Graph image with a version pill, date, title, and a checklist of highlights.
  - [Quote](https://www.ogimagecn.com/docs/components/quote.md): A testimonial / tweet-style Open Graph image with a large quote and an author row.
  - [Photo](https://www.ogimagecn.com/docs/components/photo.md): A full-bleed photo Open Graph image with a dark gradient scrim and a bottom-aligned title block.
  - [Product](https://www.ogimagecn.com/docs/components/product.md): A two-column product Open Graph image with brand and copy on the left, a product shot on the right, and a price pill.
  - [Profile](https://www.ogimagecn.com/docs/components/profile.md): A personal / portfolio Open Graph image with a circular avatar beside a name, role, bio, and website pill.
  - [Event](https://www.ogimagecn.com/docs/components/event.md): An event / launch Open Graph image with an eyebrow label, large title, and a date · location footer row.
  - [Stat](https://www.ogimagecn.com/docs/components/stat.md): A metric / dashboard Open Graph image with an eyebrow label, an oversized number, a trend pill, and a caption.
  - [Logo](https://www.ogimagecn.com/docs/components/logo.md): A centered brand Open Graph image with a logo tile, a large wordmark, and an optional tagline on a soft gradient field.
  - [Terminal](https://www.ogimagecn.com/docs/components/terminal.md): A minimal, technical Open Graph image with a wordmark and accent side-bar above a large wide-tracked uppercase headline.
  - [Editorial](https://www.ogimagecn.com/docs/components/editorial.md): A poster-style Open Graph image with oversized display type and a large faint ghost word set behind the content.
  - [Showcase](https://www.ogimagecn.com/docs/components/showcase.md): A product-showcase Open Graph image with a centered headline above a faux browser window and a minimal dashboard UI.

## Machine-readable Resources

- [Full documentation](https://www.ogimagecn.com/llms-full.txt)
- [Homepage markdown](https://www.ogimagecn.com/llms.md/content.md)
- [OpenAPI description](https://www.ogimagecn.com/openapi.json)
- [API catalog](https://www.ogimagecn.com/.well-known/api-catalog)
- [Agent skill](https://www.ogimagecn.com/.well-known/agent-skills/site-skill.md)
- [shadcn MCP server documentation](https://ui.shadcn.com/docs/mcp)