·og-image-creator
</>

og-image-creator

Smart OG image generation that studies your codebase, understands routes and brand identity, then creates contextually appropriate Open Graph images using Playwright and React components. Triggers: "create og images", "generate social cards", "add open graph images".

5Installs·1Trend·@chongdashu

Installation

$npx skills add https://github.com/chongdashu/cc-skills --skill og-image-creator

How to Install og-image-creator

Quickly install og-image-creator AI skill to your development environment via command line

  1. Open Terminal: Open your terminal or command line tool (Terminal, iTerm, Windows Terminal, etc.)
  2. Run Installation Command: Copy and run this command: npx skills add https://github.com/chongdashu/cc-skills --skill og-image-creator
  3. Verify Installation: Once installed, the skill will be automatically configured in your AI coding environment and ready to use in Claude Code, Cursor, or OpenClaw

Source: chongdashu/cc-skills.

SKILL.md

View raw

Generate authentic, brand-aligned Open Graph images by understanding your codebase first, then creating contextually appropriate images for each route using Playwright and your existing components.

Dynamic OG images: Consider Next.js OG Image Generation (@vercel/og) for dynamic content, but use static generation for brand consistency.

❌ Generic templates: Don't use stock social card templates that ignore the site's brand

Smart OG image generation that studies your codebase, understands routes and brand identity, then creates contextually appropriate Open Graph images using Playwright and React components. Triggers: "create og images", "generate social cards", "add open graph images". Source: chongdashu/cc-skills.

Facts (cite-ready)

Stable fields and commands for AI/search citations.

Install command
npx skills add https://github.com/chongdashu/cc-skills --skill og-image-creator
Category
</>Dev Tools
Verified
First Seen
2026-02-25
Updated
2026-03-10

Browse more skills from chongdashu/cc-skills

Quick answers

What is og-image-creator?

Smart OG image generation that studies your codebase, understands routes and brand identity, then creates contextually appropriate Open Graph images using Playwright and React components. Triggers: "create og images", "generate social cards", "add open graph images". Source: chongdashu/cc-skills.

How do I install og-image-creator?

Open your terminal or command line tool (Terminal, iTerm, Windows Terminal, etc.) Copy and run this command: npx skills add https://github.com/chongdashu/cc-skills --skill og-image-creator Once installed, the skill will be automatically configured in your AI coding environment and ready to use in Claude Code, Cursor, or OpenClaw

Where is the source repository?

https://github.com/chongdashu/cc-skills

Details

Category
</>Dev Tools
Source
skills.sh
First Seen
2026-02-25