Open Graph Generator — Create OG Meta Tags Online [2026]
Generate Open Graph and Twitter Card meta tags for your website. Fill in og:title, og:description, og:image, and more — get ready-to-paste HTML code. Free, browser-based OG tag generator.
<!-- Fill in the form above to generate meta tags -->
What is Open Graph Generator?
How to Use Open Graph Generator
Fill in the form fields: og:title (page title), og:description (page summary), og:image (image URL), og:url (page URL), og:type (website, article, etc.), og:site_name, and twitter:card type. As you type, the generated HTML meta tags update in real time in the code preview below. Click "Copy Code" to copy the complete set of meta tags to your clipboard. Paste them into the <head> section of your HTML page.
How Open Graph Generator Works
Common Use Cases
- Adding social sharing previews to blog posts and articles
- Setting up link preview cards for e-commerce product pages
- Configuring Twitter Card metadata for better Twitter/X engagement
- Generating OG tags for landing pages and marketing campaigns
- Setting up Discord and Slack link previews for shared URLs
- Creating consistent social sharing metadata across a multi-page website
Frequently Asked Questions
What are Open Graph meta tags?▼
Open Graph meta tags are HTML <meta> elements that define how your page appears in social media link previews. They specify the title, description, image, and URL that platforms like Facebook, LinkedIn, Twitter/X, Discord, and Slack display when someone shares your link.
Which Open Graph tags are required?▼
The four required OG tags are: og:title (page title), og:type (content type, usually "website"), og:image (preview image URL), and og:url (canonical page URL). Adding og:description and og:site_name is strongly recommended for better previews.
What is the difference between Open Graph and Twitter Cards?▼
Open Graph tags (og:*) are the standard used by most platforms. Twitter Cards (twitter:*) are Twitter/X-specific tags. Twitter will fall back to OG tags if Twitter Card tags are missing, but including both ensures the best preview on all platforms. The main Twitter-specific tag is twitter:card, which controls the card layout.
What image size should I use for og:image?▼
Facebook recommends 1200×630 pixels for og:image. Twitter recommends 1200×628 pixels for summary_large_image cards. An image of 1200×630px works well across all platforms. The image should be at least 200×200px and under 8MB. Use JPG or PNG format.
Where do I put the generated meta tags?▼
Paste the generated meta tags inside the <head> section of your HTML page, before the closing </head> tag. If you are using a framework like Next.js, React, or WordPress, use the framework-specific method for adding meta tags (e.g., Next.js Metadata API, react-helmet, or Yoast SEO plugin).
How can I test my Open Graph tags?▼
Use these free tools to test your OG tags: Facebook Sharing Debugger (developers.facebook.com/tools/debug), Twitter Card Validator (cards-dev.twitter.com/validator), LinkedIn Post Inspector (linkedin.com/post-inspector), and opengraph.xyz. These tools fetch your URL and show exactly how the link preview will appear.