Home / SEO Tools / Open Graph Generator

Open Graph Generator

Rich social previews.

Open Graph Generator at a glance

Open Graph Generator is a free online seo tool you can use right now to rich social previews โ€” no account, no install and no usage limit. It runs entirely inside your browser, so whatever you enter stays on your own device.

Price
Free โ€” no trial, no paid tier, no watermark
Sign-up
Not required
Where it runs
In your browser โ€” nothing is uploaded to a server
Works on
Chrome, Safari, Firefox and Edge โ€” desktop, tablet and phone
Category
SEO Tools
<meta property="og:title" content="My Page" /> <meta property="og:description" content="Great description for social shares." /> <meta property="og:type" content="website" /> <meta property="og:url" content="https://example.com" /> <meta property="og:image" content="https://example.com/preview.png" /> <meta property="og:site_name" content="DevHub" /> <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:title" content="My Page" /> <meta name="twitter:description" content="Great description for social shares." /> <meta name="twitter:image" content="https://example.com/preview.png" />

About Open Graph Generator

Generate the Open Graph tags that control how your page appears when someone shares it โ€” the title, description and image in the preview card.

The failure mode here is invisible to you, which is why it persists on so many sites. Without Open Graph tags, a link shared to Slack, WhatsApp, LinkedIn or Facebook renders as a bare URL or picks an arbitrary image from the page โ€” frequently a logo, an avatar or a tracking pixel. You never see this, because you are not the one sharing your own pages. The first sign of trouble is usually someone mentioning that your link 'looks broken'.

One mistake accounts for most missing preview images: og:image must be an absolute URL including the protocol and domain. A relative path such as /og.png is silently ignored by every platform, producing a card with no image at all. The image should also be at least 1200x630 for a large card, publicly reachable without a login, and served over HTTPS.

Open Graph covers most platforms because X and others fall back to it, but X will prefer its own twitter:card tags when present. If you want a large image card there specifically, set twitter:card to summary_large_image alongside your Open Graph tags. Platforms also cache preview data aggressively, so after fixing tags you generally need to use the platform's own debugger to force a refresh โ€” otherwise the old broken card persists for days.

How to use Open Graph Generator

  1. Enter your page title, description, canonical URL and an absolute image URL.
  2. Choose the content type โ€” usually website or article.
  3. Copy the generated tags into your <head>, then re-share to check the preview.

Frequently asked questions

Why does my link preview show no image?

Almost always because og:image is a relative path. It must be an absolute URL including https:// and the domain. Also confirm the image is publicly reachable without a login and at least 1200x630.

I fixed my tags but the old preview still shows โ€” why?

Platforms cache preview data aggressively, often for days. Use the platform's own debugging tool โ€” Facebook's Sharing Debugger or LinkedIn's Post Inspector โ€” to force a re-fetch.

Do I need Twitter card tags as well as Open Graph?

X falls back to Open Graph, so basic previews work without them. To control the card format specifically โ€” a large image rather than a small thumbnail โ€” add twitter:card set to summary_large_image.

What image size should I use?

1200x630 is the safe standard for a large card, giving a 1.91:1 ratio. Smaller images may render as a small square thumbnail or be dropped entirely.

More SEO Tools