Create Open Graph tags for rich social media previews.
Built locally in your browser.
What are Open Graph tags and how do you create them?
Open Graph tags control how your page looks when shared on social platforms. Each value is escaped and placed into an og: property meta tag following the Open Graph protocol. Use an image at least 1200×630 pixels for the best preview; a title, description and 1200×630 image produce a large, clickable social card.
Understanding your result
Use an image at least 1200×630 pixels for the best preview across platforms.
Formula and method
Each value is escaped and placed into an og: property meta tag, following the Open Graph protocol.
Assumptions and limitations
The tool generates Open Graph markup from your inputs; it does not host or resize your image, and platforms may cache an old preview until they refresh it. Open Graph covers many networks but some, such as Twitter/X, may also read their own tags. You still add the output to your page. Generation is local.
Worked example
A title, description and 1200×630 image produce a large, clickable social card.
How to use this tool
- Enter the title, description, URL and image.
- Choose the content type.
- Copy the og: tags into your head.
Common mistakes to avoid
- Forgetting og:image, which leaves a plain, low-engagement preview.
About the Open Graph Generator
Open Graph tags control how your page looks when shared on social platforms. Generate them in one place.
Who should use this tool
Marketers, bloggers and developers who want links to their pages to look good when shared on social platforms. If your shared posts show a bare URL or the wrong image, this builds the Open Graph tags that control the title, description, image and type for a rich preview card.
Benefits
- Builds Open Graph tags for rich social preview cards
- Escapes values and follows the Open Graph protocol
- Covers title, description, image and type in one place
- Generates markup in your browser with no account
Practical use cases
- Setting up a shareable preview for a blog post
- Fixing a link that shares without an image
- Preparing social cards for a product landing page
- Adding Open Graph tags to an HTML template
Explore all SEO and Website Tools tools
Frequently asked questions
Do I still need Twitter tags?
Twitter falls back to Open Graph, but dedicated Twitter Card tags give you more control. Use both for best results.
What image size works best for Open Graph previews?
An image of at least 1200 by 630 pixels gives the best result across platforms, producing a large, clear card rather than a small thumbnail. Keeping the important part of the image near the centre helps, since different networks may crop the edges slightly.
Why does my shared link still show the old preview?
Social platforms cache preview data, so after you update your Open Graph tags an old image or title can linger. Many networks offer a debugging or sharing tool that lets you re-fetch the page and refresh the cached preview once your new tags are live.