Open Graph Preview
Fill in your og:title, og:description, og:image, og:url, og:site_name and og:type, then see how the link card renders on Facebook, Twitter/X, LinkedIn and Slack/iMessage. Each platform sizes and clips the card differently.
How to use
- 1
Fill in the Open Graph fields
Enter og:title, og:description, og:image URL, og:url, og:site_name and og:type. These power link cards across Facebook, Twitter/X, LinkedIn and Slack.
- 2
Switch between platforms
Each tab renders the card with that platform's dimensions, colours and clipping rules. Toggle between them to spot truncation or image-fit issues.
- 3
Check your image
If your image URL is unreachable from this browser, the preview shows an empty placeholder. Use a public HTTPS URL to see the real image.
- 4
Iterate and deploy
Once you're happy with all four previews, use the Open Graph Generator tool to emit the actual <meta> tag block to paste into your HTML.
Common use cases
- Preview a campaign landing page card before launch.
- Spot a missing or undersized og:image that breaks Slack thumbnails.
- Compare how the same card renders on Twitter vs LinkedIn for a blog post.
- Test og:title and og:description length against each platform's clipping.
Limitations
- The previews are visual approximations. Each platform caches and re-renders cards server-side, so the live card may differ slightly.
- Images load from your browser. If the URL is blocked by CORS or authentication, the preview placeholder will appear.
- Line-clamp limits (1–2 lines) are estimates. Real platforms measure pixel width, not character count.
- Twitter's small
summarycard (square image) is not shown here — onlysummary_large_image.
Frequently asked questions
Related tools
View allOpen Graph Generator
Generate Open Graph tags for social media previews.
Canonical Tag Checker
Check canonical tags from pasted HTML.
SERP Snippet Preview
Preview how your page looks in Google search results.
Schema Validator
Validate JSON-LD structured data against schema.org.