Open Graph & Social Preview Generator

Acerca de

This skill automates the creation of high-quality social media sharing assets by detecting your project's framework, design tokens, and branding. It creates a dedicated, screenshot-optimized page at 1200x630, captures it using Playwright, and automatically injects the necessary Open Graph and Twitter/X meta tags into your application. By matching your existing Tailwind config or CSS variables, it ensures consistent branding across platforms like LinkedIn, Facebook, and Discord without requiring manual design work or external tools.

Características Principales

• Automated 1200x630 screenshot capture using Playwright
• 50 GitHub stars
• Accessibility-ready with automated alt-text and theme-color setup
• Design system discovery via Tailwind config and CSS variables
• Automatic framework detection for Next.js, Vite, Astro, and Remix
• Comprehensive meta tag configuration for all major social platforms

Casos de Uso

• Setting up professional social sharing for a new product launch
• Updating branding across an entire site's metadata automatically
• Generating marketing assets that perfectly match the project's UI