Social media previews

Meta tag generator.

Configure your Open Graph, Twitter Card, and SEO meta tags visually. See exactly how your links will appear on Google, Facebook, Twitter/X, and LinkedIn — then copy the generated HTML.

Preview generator

30/60
144/160

Recommended: 1200 × 630 px for best display

Google Search Result

https://example.com/page

Your page title — Company Name

A compelling description of your page that will appear in search results and social media shares. Keep it under 160 characters for best results.

Quick Check

Title length ≤ 60 chars
Description ≤ 160 chars
OG image URL set
Twitter card configured
Valid page URL
Generated HTML
<!-- Primary Meta Tags -->
<title>Your page title — Company Name</title>
<meta name="description" content="A compelling description of your page that will appear in search results and social media shares. Keep it under 160 characters for best results." />
<meta name="theme-color" content="#6366f1" />

<!-- Open Graph / Facebook -->
<meta property="og:type" content="website" />
<meta property="og:url" content="https://example.com/page" />
<meta property="og:title" content="Your page title — Company Name" />
<meta property="og:description" content="A compelling description of your page that will appear in search results and social media shares. Keep it under 160 characters for best results." />
<meta property="og:image" content="https://example.com/og-image.jpg" />
<meta property="og:site_name" content="My Website" />
<meta property="og:locale" content="en_US" />

<!-- Twitter -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:url" content="https://example.com/page" />
<meta name="twitter:title" content="Your page title — Company Name" />
<meta name="twitter:description" content="A compelling description of your page that will appear in search results and social media shares. Keep it under 160 characters for best results." />
<meta name="twitter:image" content="https://example.com/og-image.jpg" />
<meta name="twitter:site" content="@myhandle" />

How the generator works

Multi-platform preview

See how your link will appear on Google, Facebook, Twitter/X, and LinkedIn before you publish. No guesswork.

SEO quick check

Built-in character count validation for titles (≤60) and descriptions (≤160), plus checks for OG image and URL configuration.

Copy-paste ready

Generates clean, standards-compliant HTML meta tags ready to paste into your page's <head> section. No manual formatting needed.

How to use it

Getting a useful result.

  1. Fill in the title, description and image for one specific page. Every page needs its own — a single set copied across the whole site means every share looks identical.
  2. Keep the title around 60 characters and the description around 120. Longer gets cut, and where it gets cut is not up to you.
  3. Use an image at 1200×630 pixels. Anything much smaller is shown as a small square thumbnail instead of the wide card, which is far less noticeable in a feed.
  4. Copy the generated tags into the page's <head>, then send the link to yourself on WhatsApp to see the real result.

This is the single most under-used piece of markup for Indian businesses, because so much sharing happens on WhatsApp. A link with no preview is a bare blue string that nobody taps; the same link with a title, a line of description and a clear image is a small advertisement that the sender has personally endorsed.

The absolute URL matters. Image paths written relative to the page are ignored by most platforms, which is the usual reason a preview shows text but no picture. It must be the full https:// address.

Previews are cached hard. If you fix your tags and the old version keeps appearing, the platform is showing what it fetched the first time — add a query string to the link to force a fresh look while you are testing.

Common questions

Why does my link show no image on WhatsApp?

Usually one of three things: the image URL is relative rather than absolute, the file is too large for the platform to fetch quickly, or the preview was cached before the tags existed. Check the absolute URL first — it is by far the most common cause.

Do I need Twitter tags as well as Open Graph?

Not usually. X falls back to Open Graph when Twitter-specific tags are absent, so a good set of OG tags covers WhatsApp, Facebook, LinkedIn, Slack and X together. Add the Twitter card tags only if you want a different image there specifically.

Do these tags help my Google ranking?

No. They control how a link looks when someone shares it, not how it ranks. The benefit is that more people click the links your customers send each other, which is a real channel that has nothing to do with search.

Free Learning Guide

How to make your website links look premium on WhatsApp

Why do your links show up without thumbnails or descriptions? Learn how to generate beautiful social previews with Open Graph tags in 3 steps.

Read Simple Guide →

Getting a link to preview correctly is one of a hundred small things that decide whether a site earns the click — web development.