Claude Marketplaces
SkillsMCP serversMarketplacesDigestTools
Submit

This week in Claude

Every Monday: Claude Code, Agent SDK, MCP, and the Anthropic platform moves worth your time.

Skills by category
Frontend DevelopmentBackend & APIsTesting & QASecurityDevOps & CI/CDGit & Pull RequestsDocumentationCode Review & QualityAI & Agent BuildingSkill Development
MCP servers by category
Sales & MarketingWeb & Browser AutomationDatabasesAI & LLM ToolsCloud & InfrastructureCommunication & MessagingDeveloper ToolsDesign & CreativeDocuments & KnowledgeSearch & Web Crawling
Marketplaces by category
AI Agents & OrchestrationLLM IntegrationDevelopment ToolsFrontend & UIBackend & APIsDatabasesTesting & Code QualityDevOps & CloudSecurity & ComplianceGit & Version Control
Claude Marketplaces

An independent directory of skills, plugins and MCP servers for Claude Code. Not affiliated with Anthropic.

Browse

  • Skills
  • MCP servers
  • Marketplaces
  • Weekly digest
  • Skill index
  • MCP index
  • Marketplace index

Site

  • About
  • Tools
  • Submit
  • Feedback
  • Privacy
  • llms.txt
  • Plugins reference

Maker

  • Agent Caffeine
  • knobs
  • Wax
  • Snug
  • mertduzgun.com
Made by mertduzgun.com
Skills/Frontend Development
andrelandgraf avatar

Og Image Generation

andrelandgraf/fullstackrecipes

This generates Open Graph preview images for your Next.js app using the next/og library, which lets you write JSX that renders to images at the edge.

installs
238
GitHub stars
23
last updated
Aug 21, 2026
View on GitHubSave

Install

$ npx -y skills add andrelandgraf/fullstackrecipes --skill og-image-generation --agent claude-code

Installs into .claude/skills of the current project.

Sponsors

CodeRabbitSponsoredTry For FreeLid closed, agents workingTry itOpen StepsSponsoredDownload for freeAppSignalSponsoredStart Free TrialKeep API keys from agentsGet SnugBlock apps on your iPhoneGet WaxDevtools for design engineersTry it livebelt - the only tool your agent needsSponsoredone prompt install

What it does

You'd reach for this when you need those social media cards (Twitter, LinkedIn, Facebook) but don't want to mess with Puppeteer or external image services. The images get cached at build time, so there's no performance hit. It's a solid approach if you're already in the Next.js ecosystem and want dynamic previews without adding another dependency or service to your stack.

Files

Select a file.

Details

Repository
github.com/andrelandgraf/fullstackrecipes
Categories
Frontend Development, Backend & APIs, DevOps & CI/CD, Generative Media
First seen
Jun 3, 2026

More from andrelandgraf/fullstackrecipes

All 14
  • Shiki Code Blocks238
  • Use Fullstackrecipes230
  • Nextjs On Vercel164
  • Ai Chat156
  • Pino Logging Setup153
  • Using Drizzle Queries135
  • Authentication132
  • Ai Agent Workflow128
  • Neon Drizzle Setup128
  • Base App Setup122
  • Ralph Loop3.5K
  • Observability Monitoring315
  • Stripe Subscriptions269

Recommended

More Frontend Development
1ccheney avatarfeature-slicingccheney/robust-skillsProactively apply when creating new features/components/pages or setting up frontend project structure. Triggers on FSD, feature slicing, Feature-Sliced Design,237installs
2xiaodong-wu avatarweb-design-studioxiaodong-wu/web-design-studioCreate or redesign production-grade standalone websites in semantic HTML, CSS, and JavaScript with distinctive art direction and Codex-generated raster imagery.237installs
3uxjoseph avatarsupanova-design-engineuxjoseph/supanova-design-skillSupanova Landing Page Design Engine. Generates premium, conversion-optimized landing pages using pure HTML + Tailwind CSS (CDN). Overrides default LLM biases to236installs
4josiahsiegel avatartailwindcss-performancejosiahsiegel/claude-plugin-marketplaceTailwind CSS performance optimization including v4 improvements. PROACTIVELY activate for: (1) Tailwind v4 Oxide engine performance, (2) Lightning CSS minificat235installs
5nucliweb avatarwebperf-resourcesnucliweb/webperf-snippetsIntelligent network quality analysis with adaptive loading strategies. Detects connection type (2g/3g/4g), bandwidth, RTT, and save-data mode, then automaticall235installs
6yonatangross avataraccessibilityyonatangross/orchestkitAccessibility patterns for WCAG 2.2 compliance, keyboard focus management, React Aria component patterns, cognitive inclusion, native HTML-first philosophy, and235installs