// blog
Guides & Tutorials
Everything you need to know about OG images, Open Graph, and dynamic social previews.
// coming soon
What is an OG image (and why your links look broken without one)
Open Graph images are the preview cards that appear when you share a link on X, Slack, or iMessage. Here's what they are, how they work, and why most sites get them wrong.
Dynamic OG images in Next.js — a practical guide
How to generate a unique OG image for every page in your Next.js app, with real HTML and CSS instead of JSX templates.
Dynamic OG images in Astro
Astro makes static and server-rendered sites fast — here's how to add per-page OG images without maintaining separate templates.
Dynamic OG images in Remix
Use Remix resource routes to serve a unique OG image for every URL on your site.
What Satori can't do (and when to reach for a real browser)
Satori is great for simple cards, but it has a hard ceiling. CSS Grid, complex layouts, arbitrary Tailwind values, and font loading all hit it fast.
Why your link preview isn't showing — and how to fix it
Debugging missing og:image tags, wrong image dimensions, cache issues, and every other reason your link looks blank when shared.