DevToolKit

Open Graph Preview

Preview how your page looks when shared on Facebook, Twitter, and LinkedIn.

Real-time Preview
Page Info
0/100
0/200

Recommended: 1200×630px, under 8MB

Preview
No image
EXAMPLE.COM
Page Title
Checklist
○Title set
○Title ≤ 60 chars
○Description set
○Description ≤ 160 chars
○Image URL set
○Page URL set

Related Tools

Meta Tag GeneratorURL EncoderJSON FormatterCSS Gradient Generator

What is Open Graph?

Open Graph (OG) is a protocol created by Facebook that lets websites control how their content appears when shared on social media. By adding a few meta tags to your HTML <head>, you determine the title, description, and image that shows up in link previews on Facebook, LinkedIn, Slack, Discord, and many other platforms.

Twitter Cards

Twitter has its own similar system called Twitter Cards (now X Cards). If Twitter-specific tags are absent, platforms often fall back to the OG tags. Using summary_large_image is the most common card type for articles and landing pages.