Open Graph Generator

Build og: meta tags and preview how your link will look when it is shared. Fast, free, and built for simple browser-based workflows.

Instant
Processing
Private
Browser First
Free
No Signup

Open Graph Generator

Social Share Preview
example.com
Your title appears here
Your description appears here.
Advertisement

728 x 90 In-Content Ad

About This Tool

Open Graph Generator is a free online tool that builds the og: meta tags controlling how a page looks when its link is shared. Fill in your title, description and image URL, then copy the finished tags into your page's head section. A live preview shows the share card as you type.

It earns its keep the first time a post you shared turns up as a bare blue link with no picture. Reach for it when you are launching a landing page and want the cover image to show on LinkedIn, when a client's blog posts preview with the wrong headline, or when a one-off article needs tagging correctly without editing a CMS plugin. Filling the tags in by hand means remembering the exact property names.

Everything runs inside your browser. The text you type never reaches a server, and the image URL you paste is loaded into the preview by your own browser, exactly as a visitor's would be. That keeps unannounced product names, draft headlines and staging URLs out of anyone else's logs while you get the tags ready.

Builds the full set of og: tags, including image alt text and locale
Live share-card preview updates as you type, before anything is published
Optional Twitter Card tags, in summary or large-image layout
Only the fields you fill in reach the output, so no placeholder URLs slip through
Escapes quotes and angle brackets so punctuation in a title cannot break your markup
Runs entirely in your browser -- nothing you type is uploaded

How to Use Open Graph Generator

1

Enter the page details

Type the Title, Page URL and Description you want shown on the share card. The preview below updates as you type.

2

Add a share image

Paste an Image URL, ideally 1200x630 pixels, and describe it in Image Alt Text. The preview loads the image so you can check how it crops.

3

Set the type and platform options

Pick a Content Type and Locale. Leave "Also generate Twitter Card tags" ticked if you want twitter: tags alongside the og: ones.

4

Generate and copy

Click Generate Open Graph Tags, then use Copy or Download and paste the tags into your page's head section. Clear resets the form.

Frequently Asked Questions

Is this tool completely free?

Yes! All our tools are 100% free to use with no hidden costs, no registration required, and no credit card needed.

Is my data safe and private?

Absolutely. All tools run entirely in your browser (client-side). Your data never leaves your device and is not sent to our servers.

Can I use this tool offline?

Yes, once the page is loaded, the tool will continue to work even if you lose internet connection since it runs in your browser.

Is there a character limit?

There is no strict character limit, but very large amounts of text (100,000+ characters) may slow down your browser.

Can I use this for commercial projects?

Yes! All our tools are free for both personal and commercial use.

Where do Open Graph tags go in my page?

Inside the head section, anywhere before the closing head tag. The order does not matter and they can sit among your other meta tags. They must not go in the body, because social crawlers only read the head and will fall back to guessing a title and image.

What image size should I use for og:image?

Use 1200x630 pixels, which is the 1.91:1 ratio the large preview card is built around. Anything below 600x315 gets shown as a small thumbnail instead. The URL must be absolute and publicly reachable, since a relative path or a staging URL behind a login will not load.

Do I still need Twitter Card tags if I already have Open Graph tags?

Mostly no. X reads og:title, og:description and og:image when no twitter: equivalent exists. The one worth adding is twitter:card, which decides whether the link shows as a small thumbnail or a large image. Tick the Twitter option here and both sets are generated together.

Why does my link still show the old preview after I update the tags?

Social networks cache what they scraped the first time, often for days. Adding the new tags does not clear that cache. Re-scrape the URL with the platform's own tool -- the Facebook Sharing Debugger or the LinkedIn Post Inspector -- and the fresh preview appears straight away.

Does the preview show exactly what Facebook or LinkedIn will show?

It is a close approximation, not a pixel-perfect copy. Every network crops the image and truncates the title and description at its own limits, and those limits change without notice. Use it to catch a missing image or an overlong headline, then confirm with the platform's own debugger before launch.

Can it read the Open Graph tags from a URL I already have?

No. It builds tags from the fields you fill in and never fetches a page, because it runs entirely in your browser with no server to request the URL on its behalf. To check tags already on a live page, view its source or use a social platform's debugger.