About Open Graph Preview

Test how your web pages appear when shared on social media platforms. Enter a URL to fetch its Open Graph, Twitter Card, and other meta tags, then see platform-specific previews and an OG completeness score.

✓Facebook / Open Graph preview
✓Twitter / X card preview
✓LinkedIn share preview
✓Discord embed preview
✓OG completeness score & analysis
✓Full meta tag listing

Complete Guide to Open Graph Tags

Free Online Open Graph Preview & Validator

Check how any URL appears when shared on Facebook, Twitter (X), LinkedIn, Discord, Slack, and other social platforms. Our free Open Graph preview tool fetches the page's OG meta tags and displays realistic previews for each platform, along with a completeness score and detailed analysis of missing tags.

What Is the Open Graph Protocol?

The Open Graph protocol was originally created by Facebook in 2010 and enables any web page to become a rich object in a social graph. Social platforms read meta tags with property="og:..." attributes to determine the title, description, image, and other metadata displayed in preview cards.

Essential Open Graph Tags

<!-- Required OG Tags -->
<meta property="og:title" content="Page Title">
<meta property="og:description" content="Page description">
<meta property="og:image" content="https://example.com/image.jpg">
<meta property="og:url" content="https://example.com/page">
<meta property="og:type" content="website">

<!-- Recommended OG Tags -->
<meta property="og:site_name" content="Site Name">
<meta property="og:locale" content="en_US">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">

Twitter Card Tags

Twitter/X uses its own meta tags for link previews. If Twitter-specific tags are missing, it falls back to Open Graph tags. The two main card types are summary and summary_large_image.

How Each Platform Uses OG Tags

Facebook & Messenger

  • Uses og: prefixed tags
  • Recommended image: 1200x630px
  • Shows site name, title, description
  • Caches previews

Twitter / X

  • Uses twitter: tags first, then OG
  • Supports summary and summary_large_image
  • Title limited to about 70 characters
  • Large image minimum: 300x157px

LinkedIn

  • Uses Open Graph tags
  • Recommended image: 1200x627px
  • Shows image, title, and domain
  • Use Post Inspector to refresh cache

Discord & Slack

  • Uses Open Graph plus Twitter tags
  • Shows rich embeds
  • Displays site name, title, description, image
  • Supports oEmbed for rich previews

OG Image Best Practices

Size & Format

  • Ideal size: 1200x630 pixels
  • Minimum: 600x315 pixels
  • Aspect ratio: 1.91:1
  • File size under 5MB, ideally under 1MB
  • Formats: JPG, PNG, or WebP

Design Tips

  • Keep key content in the center safe zone
  • Use readable text over images
  • Include your brand logo
  • Use high contrast colors
  • Test at mobile preview sizes

How to Use This Tool

  1. Enter a URL: Paste the full URL of the page you want to preview into the input field.
  2. Click Preview: The tool fetches the page and extracts Open Graph, Twitter Card, and meta tags.
  3. Check Previews: Switch between Facebook, Twitter/X, LinkedIn, and Discord tabs to see how the link will appear.
  4. Review Score: Check the OG score and review specific missing tags.
  5. Browse All Tags: Use the All Tags tab to see every meta tag detected on the page.
  6. Fix & Re-test: Update your page meta tags, redeploy, and test again.

Common OG Tag Issues

Missing og:image: Without an image, social previews look plain and usually get less engagement.

Wrong image size: Images that are too small or use the wrong aspect ratio may be cropped or ignored.

Cached previews: Social platforms cache OG data. Use their debugger tools after updating tags.

Relative URLs: Always use absolute URLs starting with https:// for og:image and og:url.

Perfect For

  • Web developers and designers
  • SEO specialists
  • Social media managers
  • Content marketers
  • Digital marketing teams
  • QA testers
  • Bloggers and content creators
  • E-commerce store owners
  • Product managers
  • Startup founders
  • Freelance developers
  • Anyone sharing links on social media

How It Works

This tool fetches the HTML of the provided URL server-side to read its meta tags, similar to how social media crawlers work. Only the HTML head metadata is read, and no data is stored.

Related SEO & Web Tools

<meta>

Meta Tag Generator

Generate optimized OG, Twitter Card, and SEO meta tags for your pages.

</>&&amp;&lt; &gt;

HTML Entity Encoder

Encode special characters for safe use in meta tag content values.

Favicon Downloader

Download favicons from any website in multiple sizes and formats.

Domain Age Checker

Check when a domain was registered and how old it is.

DNS

DNS Checker

Look up DNS records for any domain - A, AAAA, MX, TXT, CNAME, NS.

S

SSL Checker

Verify SSL certificate details, expiry dates, and security configuration.