Meta Preview — See How Your Link Looks on Google, Twitter, LinkedIn & More

Preview how your URL appears when shared on Google, X/Twitter, LinkedIn, WhatsApp, Slack, Discord, Facebook, and iMessage

See how your link looks everywhere

Paste any URL to preview how it appears when shared on social media, search engines, and messaging apps.

What Are Meta Tags and Why Do They Matter?

Meta tags are snippets of HTML that describe a page's content to search engines and social media platforms. They don't appear on the page itself — instead, they live in the <head> section of your HTML and control how your page is displayed when shared or indexed.

The most important meta tags for social sharing are Open Graph (OG) tags, originally created by Facebook, and Twitter Card tags. When someone shares a link on any social platform, these tags determine what title, description, and image appear in the preview card. Without them, platforms either guess (often poorly) or show nothing at all.

For SEO, the <title> tag and <meta name="description"> tag directly influence how your page appears in Google search results. A well-crafted title and description can dramatically improve click-through rates — even without changing your ranking position. Studies show that optimizing these tags alone can increase organic traffic by 20-30%.

This meta tag preview tool lets you check exactly how your page will look when shared on Google, X/Twitter, LinkedIn, Facebook, WhatsApp, Slack, Discord, and iMessage — all from one place. You can spot issues like missing images, truncated titles, or absent descriptions before anyone else sees them.

Open Graph Tags Explained

The Open Graph protocol was introduced by Facebook in 2010 and has since become the standard for social sharing metadata across nearly every platform. Here are the essential OG tags every page should have:

Common mistakes include using relative image URLs (always use absolute URLs starting with https://), images that are too small (under 200x200 pixels), or missing the og:image tag entirely — which means your shared links show up as plain text with no visual appeal.

Twitter Card Tags

Twitter (now X) uses its own meta tag system called Twitter Cards. While Twitter will fall back to Open Graph tags if Twitter-specific tags aren't present, using dedicated Twitter Card tags gives you more control over how your content appears on the platform.

The twitter:card tag determines the card layout. There are four types:

Key Twitter Card tags include twitter:title (max ~70 characters), twitter:description (max ~200 characters), twitter:image (minimum 144x144 pixels, maximum 4096x4096, under 5MB), and twitter:site (your @username). If you don't set these, Twitter falls back to the equivalent OG tags — so at minimum, make sure your OG tags are solid.

Platform-Specific Requirements

Each platform has its own rules for how link previews are rendered. Here's what you need to know:

Google Search

Title should be 30-60 characters (Google may rewrite longer titles). Meta description should be 120-155 characters. Google uses its own algorithms to generate snippets and may ignore your description entirely if it finds better content on the page.

X / Twitter

Images must be at least 144x144 pixels (summary card) or 300x157 (large image card), maximum 4096x4096, and under 5MB. Supported formats: JPG, PNG, WEBP, GIF. Twitter caches cards aggressively — use the Card Validator to refresh.

LinkedIn

Recommended image size is 1200x627 pixels. Title can be up to 150 characters. LinkedIn caches previews for about 7 days. Use the Post Inspector to refresh.

Facebook

Recommended image size is 1200x630 pixels (1.91:1 ratio). Minimum image size is 200x200 pixels, but images under 600x315 will appear as small thumbnails. Use the Sharing Debugger to refresh cached previews.

WhatsApp

Uses Open Graph tags exclusively. Image minimum is 300x200 pixels. WhatsApp caches previews for about 24 hours on the server side, and longer on individual devices.

Slack

Renders OG tags with a left-side color bar. Shows the favicon, site name, title (as a clickable link), description, and image. Slack respects the og:site_name tag prominently.

Discord

Uses OG tags with a left-side accent bar. Description is capped at 256 characters. Discord supports color customization via the theme-color meta tag for the accent bar.

How to Add Meta Tags to Your Website

Adding meta tags is straightforward. Place them in the <head> section of your HTML. Here's a complete example with all recommended tags: 

<title>Your Page Title</title>
<meta name="description" content="Your page description here" />

<!-- Open Graph -->
<meta property="og:title" content="Your Page Title" />
<meta property="og:description" content="Your page description" />
<meta property="og:image" content="https://example.com/image.png" />
<meta property="og:url" content="https://example.com/page" />
<meta property="og:type" content="website" />

<!-- Twitter Card -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Your Page Title" />
<meta name="twitter:description" content="Your page description" />
<meta name="twitter:image" content="https://example.com/image.png" />

If you use a framework like Next.js, Astro, or WordPress, these are typically set through the framework's head management system or SEO plugins. Our meta tag checker tool above can generate the correct HTML for you — just paste your URL, edit the tags in preview mode, and copy the generated code.

More tools

You might also like

User Agent
View and copy your full user agent string with parsed breakdown
Browser Info
Detect your browser name, version, OS, and device type
DNS Server
Find out which DNS resolver your connection is using
JSON Formatter
Format, validate, and minify JSON with syntax highlighting

FAQ

Frequently Asked Questions

How do I add meta tags to my website?
Meta tags go in the <head> section of your HTML. The most important ones are <title>, <meta name="description">, and the Open Graph tags (og:title, og:description, og:image, og:url). If you use a framework like Next.js, WordPress, or Astro, they usually have built-in ways to set these. Our tool can generate the correct HTML for you — just paste your URL, edit the previews, and copy the generated code.
What's the difference between OG tags and Twitter cards?
Open Graph (OG) tags were created by Facebook and are now used by most platforms including LinkedIn, WhatsApp, Slack, and Discord. Twitter Card tags are Twitter-specific and give you more control over how content appears on X/Twitter. If Twitter Card tags are missing, Twitter falls back to OG tags. For maximum compatibility, set both — but OG tags alone will work on most platforms.
Why doesn't my link preview show an image?
The most common reasons are: (1) missing og:image tag, (2) using a relative URL instead of an absolute URL starting with https://, (3) the image URL is blocked by robots.txt or requires authentication, (4) the image is too small (most platforms require at least 200x200 pixels), or (5) the image format is not supported. Use this tool to check if your og:image tag is present and the URL is accessible.
How long does it take for link previews to update?
Each platform caches previews differently. Facebook caches for about 30 days (use the Sharing Debugger to refresh). Twitter caches for about 7 days (use the Card Validator). LinkedIn caches for about 7 days (use the Post Inspector). WhatsApp caches for about 24 hours on servers and longer on devices. Slack and Discord typically refresh within a few hours.
What size should my OG image be?
The recommended size is 1200 x 630 pixels (1.91:1 aspect ratio). This works well across Facebook, Twitter, LinkedIn, and WhatsApp. The minimum size is 200x200 pixels, but images under 600x315 may appear as small thumbnails on Facebook. Keep the file size under 5MB for Twitter and under 8MB for Facebook.
Do I need both OG tags and Twitter Card tags?
Technically, no — Twitter will fall back to OG tags if Twitter Card tags aren't present. However, using dedicated Twitter Card tags gives you more control over the card type (summary vs. summary_large_image) and lets you customize the title and description specifically for Twitter's audience. For the best results, set both.
How can I test my meta tags without sharing?
That is exactly what this tool does! Paste your URL above and instantly see how it will look on 8 different platforms without actually posting anywhere. You can also use platform-specific tools: Facebook Sharing Debugger, Twitter Card Validator, and LinkedIn Post Inspector. Our tool combines all of these into one place.