Skip to content

Web, SEO & Business

Open Graph Preview: How Your Link Looks When Shared

Fill in a title, description and image, or paste your page’s HTML to read the tags it already has. See approximate link cards on six platforms, fix what is missing, then copy the tags.

Free · no sign-up · runs in your browser · updated

Use Open Graph Preview

Already have a page? Paste its HTML to read the existing tags

Open your page, choose “View page source” (View Source), copy all of it or just the <head> part, then paste it here. The HTML is read in this browser and is not sent anywhere. The form below will be overwritten.

35 characters · ideally up to 60

69 characters · ideally up to 160

The public address of the image. Your browser loads that image directly from its site for the preview.

X / Twitter card

Suggestions

  • og:image is empty; the link will appear without an image and be far less appealing.

Preview (approximate)

Each platform changes its look and caches old results; use this as a guide, then test the real link on the platform.

Facebook

tipamedia.com

Free Online Tools for Everyday Work

Calculators, PDF, image and developer tools that run in your browser.

X (Twitter) · large image
Free Online Tools for Everyday Work

tipamedia.com

LinkedIn

Free Online Tools for Everyday Work

tipamedia.com

WhatsApp

Free Online Tools for Everyday Work

Calculators, PDF, image and developer tools that run in your browser.

tipamedia.com

Slack

Tipamedia

Free Online Tools for Everyday Work

Calculators, PDF, image and developer tools that run in your browser.

iMessage

Free Online Tools for Everyday Work

tipamedia.com

Meta tags for <head>

<meta property="og:type" content="website">
<meta property="og:title" content="Free Online Tools for Everyday Work">
<meta property="og:description" content="Calculators, PDF, image and developer tools that run in your browser.">
<meta property="og:url" content="https://tipamedia.com/tools">
<meta property="og:site_name" content="Tipamedia">
<meta property="og:locale" content="en_US">
<meta name="twitter:card" content="summary_large_image">

How to use Open Graph Preview

  1. Fill in the title, description, page URL and image URL. For a page that is already online, open the “Already have a page?” section, paste the page source, then click “Read tags and fill in the form”.

  2. Read the suggestions above the preview: text length, image ratio and size, and missing tags, including WhatsApp’s 600 KB image limit.

  3. Choose HTML, Next.js or Nuxt, copy the tags, then test the real link on each platform and clear its cache if needed.

The tags it generates

og:title, og:description, og:url, og:image and og:image:alt are recommended by LinkedIn; the tool adds og:type, og:site_name, og:locale and twitter:card for X. X falls back to Open Graph tags, so adding twitter:card is usually enough. Image dimensions (og:image:width/height) are included when the image can be read from its URL.

1200×630 px (a ratio of about 1.91:1) is a safe general guideline, not a requirement of the protocol; LinkedIn recommends at least 1200×627 px and a file of at most 5 MB. Facebook accepts images up to 8 MB, while WhatsApp’s documentation asks for images under 600 KB with a width of at least 300 px. Use an image that still reads well when shrunk, with no important text near the edges where it can be cropped.

Reading tags from a page that is already online

Browsers are not allowed to fetch other sites’ pages, so this tool cannot check a URL automatically. Instead, copy the page source (View Source) and paste it into the HTML field; the tool reads og:*, twitter:*, title, meta description and the canonical link right in your browser. Missing tags are reported, and empty fields are filled from fallback tags where available.

Note that what is read is the HTML you paste. If a site adds its tags with JavaScript, copy the result from “Inspect” (the rendered elements), but remember that crawlers such as facebookexternalhit do not run JavaScript, so the tags must be in the initial HTML.

Previews are only approximate

Facebook, LinkedIn, X, WhatsApp, Slack and iMessage change their layout and text cut-off limits without notice, and they cache old results. Slack, for example, caches results for about 30 minutes. After you update your tags, clear the cache with each platform’s official tool (for example Facebook’s Sharing Debugger and LinkedIn’s Post Inspector), then test the real link.

Slack and iMessage do not publish detailed image size specifications, so their cards here are only a rough idea. If you enter an image URL, your browser loads it directly from the owner’s site for the preview. An image chosen from your device is not uploaded.

Questions about Open Graph Preview

What is the correct Open Graph image size?

A common guideline is 1200×630 px (a 1.91:1 ratio); LinkedIn recommends at least 1200×627 px and a file of at most 5 MB, Facebook allows up to 8 MB, and WhatsApp asks for under 600 KB. To be safe on every platform, make it about 1200×630 px and shrink the file to under 600 KB.

Can this tool check my URL automatically?

No. Browsers restrict reading other sites’ pages, and this tool does not send data to a server. Paste the page’s HTML source (View Source) to read the tags it has.

Why is the image or title on my link not changing?

Platforms cache old results. Clear the cache with Facebook’s Sharing Debugger or LinkedIn’s Post Inspector, or wait a few days, and make sure the tags are in the HTML your server sends.

Do I need Twitter Card tags?

Only twitter:card is needed; the title, description and image are taken from the Open Graph tags. Add twitter:site if you want to link an account.

Is my image uploaded?

No. An image from your device is only shown in your browser for the preview; the tags need a public image URL on your site.

Need more than tools?

We build websites, apps, and custom systems for your business.

These tools are only a small part of what Tipamedia can build. Tell us what you need and we will help you work out the next step.