OG Social Previewer

Your data never leaves your browser

Debug your Open Graph and Twitter Card meta tags with real-time previews for Google, Facebook, Twitter, LinkedIn, and Slack.

When you share a link on Facebook, LinkedIn, Twitter, or Slack, the platform reads your Open Graph meta tags to generate the preview card. A misconfigured tag means the difference between a compelling, click-worthy preview and a blank link that gets ignored. devmeldex's free Open Graph preview tool lets you compose and debug meta tags in real time with pixel-accurate previews of how your content will appear across five major platforms — Google, Facebook, Twitter, LinkedIn, and Slack.

Title45/70 chars

Site Name

Description137/160 chars

URL

Image URL (1200×630 recommended)

Twitter Card Type

Twitter @handle

https://example.com/landing

My Amazing Landing Page — Product Launch 2026

Discover how our innovative product can transform your workflow. Join 10,000+ professionals who have already upgraded their productivity.

Generated Meta Tags

<meta property="og:title" content="My Amazing Landing Page — Product Launch 2026" />
<meta property="og:description" content="Discover how our innovative product can transform your workflow. Join 10,000+ professionals who have already upgraded their productivity." />
<meta property="og:url" content="https://example.com/landing" />
<meta property="og:image" content="https://placehold.co/1200x630/0f172a/06d6a0?text=OG+Image+Preview" />
<meta property="og:site_name" content="Example.com" />
<meta property="og:type" content="website" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="My Amazing Landing Page — Product Launch 2026" />
<meta name="twitter:description" content="Discover how our innovative product can transform your workflow. Join 10,000+ professionals who have already upgraded their productivity." />
<meta name="twitter:image" content="https://placehold.co/1200x630/0f172a/06d6a0?text=OG+Image+Preview" />
<meta name="twitter:creator" content="@example" />

Example: See It in Action

Input

Output

A rich preview card with title, description, image, and site name displayed exactly as Facebook would render it.

The previewer simulates how each platform renders your meta tags, letting you spot issues before going live.

How to Use This OG Social Previewer

1
Enter your page details
Fill in the Title, Description, URL, Image URL, and Site Name fields.
2
Select a platform
Click any platform tab (Google, Facebook, Twitter, LinkedIn, Slack) to see how your link will appear.
3
Adjust your content
Edit fields and see previews update in real time. Character counters help you stay within optimal lengths.
4
Choose Twitter card type
Select between "Summary Large Image" (wide) or "Summary" (square) depending on your content type.
5
Copy generated tags
Click "Copy All Tags" to get the complete meta tag code ready to paste into your HTML head.

Who Should Use This Tool?

Content Marketing

Optimise social sharing previews before publishing blog posts and landing pages.

SEO Auditing

Debug why your links display incorrectly on social media by testing different tag combinations.

A/B Testing

Compare different title and description combinations to find the most click-worthy version.

Developer Workflow

Test OG tags during development without deploying and using platform-specific debugging tools.

Frequently Asked Questions

Does this tool fetch my live page?: No. The previewer uses the values you enter in the form. This means you can test tags before deploying them.
What is the recommended OG image size?: 1200×630 pixels at 1.91:1 aspect ratio renders correctly across Facebook, LinkedIn, and Twitter.
How do I force Facebook to re-scrape my page?: Use the Facebook Sharing Debugger at developers.facebook.com/tools/debug/. Enter your URL and click "Scrape Again".
Should I use both Open Graph and Twitter Card tags?: Yes. Use OG tags as primary (widest platform support) and add Twitter Card tags for Twitter-specific optimisation.
Is my data sent to any server?: No. All preview rendering happens locally in your browser. No meta tag content is transmitted anywhere.

⇔

Diff Checker

Compare text and code side-by-side with instant highlighting.

▣

QR Generator

Create customisable QR codes with zero expiry or tracking.

◷

Timezone Visualizer

Plan meetings across global time zones with overlap detection.

Browse all free tools →

Loading tool...

How to Use This OG Social Previewer

Enter your page details

Fill in the Title, Description, URL, Image URL, and Site Name fields.

Select a platform

Click any platform tab (Google, Facebook, Twitter, LinkedIn, Slack) to see how your link will appear.

Adjust your content

Edit fields and see previews update in real time. Character counters help you stay within optimal lengths.

Choose Twitter card type

Select between "Summary Large Image" (wide) or "Summary" (square) depending on your content type.

Copy generated tags

Click "Copy All Tags" to get the complete meta tag code ready to paste into your HTML head.

Who Should Use This Tool?

Content Marketing

Optimise social sharing previews before publishing blog posts and landing pages.

SEO Auditing

Debug why your links display incorrectly on social media by testing different tag combinations.

A/B Testing

Compare different title and description combinations to find the most click-worthy version.

Developer Workflow

Test OG tags during development without deploying and using platform-specific debugging tools.

Frequently Asked Questions

Does this tool fetch my live page?

No. The previewer uses the values you enter in the form. This means you can test tags before deploying them.

What is the recommended OG image size?

1200×630 pixels at 1.91:1 aspect ratio renders correctly across Facebook, LinkedIn, and Twitter.

How do I force Facebook to re-scrape my page?

Use the Facebook Sharing Debugger at developers.facebook.com/tools/debug/. Enter your URL and click "Scrape Again".

Should I use both Open Graph and Twitter Card tags?

Yes. Use OG tags as primary (widest platform support) and add Twitter Card tags for Twitter-specific optimisation.

Is my data sent to any server?

No. All preview rendering happens locally in your browser. No meta tag content is transmitted anywhere.

About this tool

Example: See It in Action

How to Use This OG Social Previewer

Enter your page details

Select a platform

Adjust your content

Choose Twitter card type

Copy generated tags

Who Should Use This Tool?

Content Marketing

SEO Auditing

A/B Testing

Developer Workflow

Frequently Asked Questions

Try More Free Tools

Diff Checker

QR Generator

Timezone Visualizer

About this tool

Example: See It in Action

How to Use This OG Social Previewer

Enter your page details

Select a platform

Adjust your content

Choose Twitter card type

Copy generated tags

Who Should Use This Tool?

Content Marketing

SEO Auditing

A/B Testing

Developer Workflow

Frequently Asked Questions

Try More Free Tools

Diff Checker

QR Generator

Timezone Visualizer