marketing-shibata50/claude-code-ultimate-guide
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

docs: add OG image generation workflow + Astro template

Browse source 
New workflow guide covering Satori + resvg pattern for dynamic social
preview images. Includes production template, gotchas (font format,
static file shadowing), design variants, and testing approach.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Florian BRUNIAUX 2026-03-11 11:53:50 +01:00
parent fe28f89574
commit 2f83320bc7
4 changed files with 471 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

7
guide/workflows/README.md
View file

@ -81,6 +81,12 @@ Convert design mockups (Figma, wireframes) into working code.
**When to use**: Frontend development, UI implementation, design system work
### [OG Image Generation](./og-image-generation.md)
Generate social preview images dynamically at build time with Satori and resvg.
**When to use**: Astro projects, keeping social previews accurate without maintaining static PNGs
### [PDF Generation](./pdf-generation.md)
Generate professional PDFs using Quarto/Typst with Claude Code.
@ -166,6 +172,7 @@ Multi-session task tracking with TodoWrite, tasks API, and context persistence a
| **New project from template** | [Skeleton Projects](./skeleton-projects.md) |
| **Team AI instructions** | [Team AI Instructions](./team-ai-instructions.md) |
| **Documentation** | [PDF Generation](./pdf-generation.md) |
| **Social previews** | [OG Image Generation](./og-image-generation.md) |
| **Conference talk from raw material** | [Talk Preparation Pipeline](./talk-pipeline.md) |
| **Audio feedback** | [TTS Setup](./tts-setup.md) |
| **Multi-agent tasks** | [Agent Teams](./agent-teams.md) |