Open Graph Generator Online - OG Image Tags
Table of contents
When someone shares your link, the platform fetches the page and builds a preview card from its Open Graph tags. Without them it guesses - grabbing whatever text and image it can find - and the result is usually a truncated sentence next to your logo or, worse, nothing at all. Since that card is what people actually see in a feed, it does more to determine whether anyone clicks than the page title does. Four tags carry the weight: og:title, og:description, og:image and og:url. The image matters most, because it occupies most of the card; 1200×630 is the size to target, and it must be an absolute URL, since scrapers do not resolve relative paths. The behaviour that catches people out is caching. Facebook and LinkedIn cache what they fetched the first time, so fixing your tags does not fix an already-shared link until you clear the cache through their own debugging tools. Tags are generated in your browser.
SEO and webmaster checks are only useful if they match what Googlebot or a browser would see. Guessing from the HTML source alone is how people ship broken tags.
Open Graph Generator is a good fit when setting up sharing previews for a new page or article.
What you actually get
Open Graph Generator is built around a few practical wins, not a long feature list:
- Live preview, so you see the card before publishing rather than after someone shares it.
- Generates correct syntax, where a mistyped property name silently does nothing.
- Covers the four tags that actually determine how the card renders.
- Runs in your browser with no account.
- Output is plain HTML for any site or framework.
A straightforward way to do it
- Enter your title and description. These can differ from your SEO title and meta description - write them for someone scrolling a feed.
- Add an absolute image URL. 1200×630, and the full URL including https://. Relative paths are not resolved by scrapers.
- Set the canonical og:url. The address the share should point to, without tracking parameters.
- Paste the tags into your head and test. Use the platform debugger to confirm and to clear any cached version.
When this is the right tool
- Setting up sharing previews for a new page or article.
- Fixing pages that share as a blank or unappealing card.
- Giving a landing page a share image tailored for social rather than reusing the logo.
- Standardising previews across a site where each page currently guesses.
- Preparing a launch where the shared card is the first thing most people will see.
Details that save a retry
- Use 1200×630. Smaller images render as a small thumbnail beside text instead of a full-width card, which performs noticeably worse.
- Always use absolute image URLs. A relative path is the single most common reason an image fails to appear.
- Test with the platform debugger before launch, and use it to clear the cache when you change tags on an already-shared URL.
- Write the og:description for a feed, not for search. It is a hook, not a summary.
- Twitter/X reads Open Graph as a fallback, but its own Card tags give more control - the Twitter Card Generator covers those.
Easy mistakes
- Using a relative image path, so no image appears in the card at all.
- Changing tags and assuming the fix is live - the platform serves its cached copy until you clear it.
- Using an image too small or the wrong shape, which downgrades the card to a thumbnail layout.
- Omitting og:url, letting tracking-parameter variants be shared and counted as separate URLs.
- Reusing the SEO meta description verbatim, which reads as a search snippet rather than something worth clicking in a feed.
Where your files go
Open Graph Generator runs in your browser. The file or text you paste stays on your device. There is no account, and nothing is stored on a ToolBox server for this job.
Related tools worth opening next
If this is one step in a longer job, these usually come after it:
- Twitter Card Generator - Generate Twitter Card meta tags with a live preview
- Meta Tag Generator - Generate HTML meta tags for SEO, social and technical use
- Share Card Studio - Turn a screenshot into a framed, shadowed social post image
Questions people ask first
What happens if I don't add Open Graph tags at all?
Without them, platforms often fall back to guessing a title/image from the page content, which can produce an inconsistent or unappealing preview - explicit Open Graph tags give you full control over how your shared links look.
What image size should I use for og:image?
A common recommendation is 1200x630 pixels, which displays well across most platforms without awkward cropping - the live preview in this tool helps you check how your chosen image actually renders.
Do these tags also help with Twitter/X previews?
Twitter/X falls back to Open Graph when its own tags are absent, so you get a reasonable card either way. For full control - particularly the large-image card format - add dedicated Twitter Card tags with the Twitter Card Generator.
Why is my preview image not showing?
Nearly always a relative image URL. Scrapers do not resolve relative paths, so og:image must be a complete address including https://. After that, check the image is publicly reachable and not blocked by robots.txt.
I fixed my tags but the old preview still shows - why?
Because platforms cache what they fetched the first time a URL was shared. Facebook's Sharing Debugger and LinkedIn's Post Inspector both re-scrape on demand, which is the only way to refresh an already-cached link.
Should the og:description match my meta description?
Not necessarily. A meta description is written for a search result; an og:description is written for someone scrolling a feed. The second can be shorter, punchier and less literal without hurting SEO at all.
Open the Open Graph Generator when you are ready. It is free, and you do not need an account.