Open Graph Generator
Control how your page looks when someone shares it. Enter the title, description, address and image, and get the Open Graph meta tags that Facebook, LinkedIn, WhatsApp, Slack and many other apps read to build a link preview. The generator flags missing required tags, images that are too small and text that will be cut off.
- Runs in your browser
- No sign-up
- Free to use
Link preview
An approximation of how Facebook, LinkedIn and chat apps show a shared link. The image is fetched from its address only when you select “Load image”.
How to use Open Graph Generator
- Enter the title, description and canonical URL of the page.
- Add the address of the sharing image and, ideally, its size and a description.
- Choose the type; articles and profiles get extra fields.
- Copy the tags into the head of your page and test the link in a sharing debugger.
Open Graph Generator features
All four required tags
og:title, og:type, og:image and og:url, with a warning for any that are missing.
Image checks
Warns about small images, the wrong shape, relative paths and http addresses.
Article and profile tags
Published and updated dates, author, section, tags; first name, last name, username.
Live preview
Shows the title, description and domain as a share card.
Privacy-conscious
The image is requested from its server only when you ask for it.
Safely escaped
Quotes and angle brackets in your text cannot break the HTML.
When to use Open Graph Generator
- Fixing a link that shares without an image.
- Setting up sharing tags for a new site or template.
- Adding article metadata to blog posts.
- Checking that a sharing image has the right dimensions.
Open Graph Generator FAQ
What is Open Graph?
A protocol introduced by Facebook that lets a page describe itself with meta tags. Apps that display link previews read these tags to choose the title, text and image.
Which tags are required?
The protocol requires og:title, og:type, og:image and og:url. og:description is optional in the specification but used by practically every app, so include it.
What size should the image be?
1200 × 630 pixels is the standard recommendation: a 1.91:1 shape that displays as a large card. Images under 600 × 315 appear as small thumbnails, and those under 200 × 200 are ignored by Facebook.
Why is my new image not showing?
Platforms cache previews. Use the platform’s debugging tool, such as Facebook’s Sharing Debugger or LinkedIn’s Post Inspector, to fetch the page again.
Do I also need Twitter Card tags?
X reads Open Graph tags as a fallback for title, description and image, but needs twitter:card to choose the card layout. The Twitter Card Generator on this site creates those.
Does the tool fetch my page?
No. Tags are built in your browser from what you type. Only the “Load image” button makes a request, directly from your browser to the image address.
Why shared links need their own description
When a link is pasted into a social network or a chat, the app fetches the page and builds a small card: an image, a title, a line of text and the domain. That card is often the first, and sometimes the only, impression of your page. Left to itself, the app guesses, and the result may be a cropped logo, a navigation label as the title, or no image at all.
Open Graph tags replace the guess with your choice. They are meta elements in the head of the page whose property names begin with “og:”. Four are required by the protocol, the title, the type, the address and an image, and a description completes the card. Because nearly every platform that displays link previews supports them, one set of tags serves Facebook, LinkedIn, WhatsApp, Slack, Discord and many more.
The image deserves the most care. It occupies most of the card and decides whether the link is noticed. The common standard is 1200 by 630 pixels, a shape of 1.91 to 1, with the important content in the centre, since some apps crop to a square. The address must be absolute and publicly reachable; images behind a login or blocked for crawlers do not appear.
Declaring the image’s width and height lets platforms lay out the card before the image has loaded, which matters the first time a link is shared. After publishing, run the page through a sharing debugger: it shows exactly what the platform read, reports errors, and refreshes the cached preview so that your changes take effect.