home/social/meta-tags

Free Open Graph & Twitter Card Meta Tag Generator

Generate Open Graph & Twitter Card meta tags

Fill in the fields above to generate meta tags...

How to Use Meta Tag Generator

  1. 1

    Enter your page info

    Fill in the title, description, image URL, page URL, and site name.

  2. 2

    Configure Twitter Card settings

    Set your Twitter handle and select the card type (summary or summary_large_image).

  3. 3

    Copy the generated tags

    Click Copy to grab all generated HTML meta tags and paste them into your page's <head> section.

Frequently Asked Questions

Is my data safe?
Yes. All processing happens entirely in your browser. Your data never leaves your device and is never uploaded to any server.
Where do I put these meta tags?
Paste the generated tags inside the <head> section of your HTML page, before the closing </head> tag. In WordPress, use a plugin like Yoast SEO or RankMath to add them via the admin interface without editing HTML directly.
What is the difference between Open Graph and Twitter Cards?
Open Graph (og:) tags are a standard created by Facebook and are used by most platforms including Facebook, LinkedIn, Slack, Discord, and WhatsApp. Twitter Card (twitter:) tags are specific to Twitter/X. When both are present, Twitter uses its own tags and other platforms use Open Graph. Twitter also falls back to og: tags if twitter: tags are absent.
Do I need Open Graph tags for SEO?
Open Graph tags do not directly affect Google search rankings, but they improve the appearance of your links when shared on social media, which can increase click-through rates and drive more traffic to your site.
Which og:type should I use?
Use 'website' for homepages and static pages, 'article' for blog posts and news content (which enables additional article-specific properties), and 'product' for e-commerce product pages. The type helps platforms understand your content and may affect how they display the card.

Learn more

About Meta Tag Generator

Generate the complete set of Open Graph and Twitter Card HTML meta tags for your website in seconds. Fill in your page title, description, image URL, and site information — the tool generates clean, copy-paste-ready HTML that you drop into your page's head section. Covers og:title, og:description, og:image, og:url, og:type, twitter:card, twitter:site, and more. No coding knowledge required. Generated entirely in your browser — no server, no sign-up.

Why Use Meta Tag Generator?
  • Complete tag set — generates all standard Open Graph and Twitter Card properties in one operation.
  • Copy-ready HTML — output is formatted as proper HTML meta tags, ready to paste directly into your page's head.
  • Covers all major platforms — Open Graph tags work on Facebook, LinkedIn, Slack, Discord, and most link preview tools.
  • No coding required — fill in plain-text fields without writing any HTML manually.
  • Pair with the OG Preview tool to visually verify how the tags will render before adding them to your page.
Common Use Cases

Blog and article publishing

Add social meta tags to each blog post so shared links display a compelling title, description, and feature image on social media.

Landing page optimization

Ensure campaign landing pages show the right image and messaging when shared in ads, emails, and social posts driving traffic.

E-commerce product pages

Add product images and descriptions to Open Graph tags so product links display correctly when customers share them on social media.

SaaS and startup websites

Implement proper social meta tags on your marketing site so links shared by users and press display your brand image and key messaging.

Tips & Best Practices
  • 💡Set og:type to 'article' for blog posts and 'website' for your homepage and general pages. The 'article' type allows additional tags like article:published_time and article:author.
  • 💡The og:image URL must be an absolute URL (starting with https://) — relative paths like /images/hero.jpg will not work for social platforms fetching the image.
  • 💡Twitter falls back to Open Graph tags if Twitter Card tags are absent. If you only add Open Graph tags, Twitter will still display a card using the og: values.
  • 💡Use the OG Preview tool alongside this generator to verify the tags produce the visual result you expect before publishing.
How It Works

The generator produces HTML5-compliant meta tags using the property attribute for Open Graph (og:) tags and the name attribute for Twitter Card (twitter:) tags, per each specification's requirements. Open Graph is defined by the Open Graph Protocol (ogp.me). Twitter Cards are documented in Twitter's developer documentation. The tool generates the minimum recommended set of tags for each type, covering the properties that all major platforms support and use for link preview rendering.

More Social Media Tools

🔗 OG Card Preview📐 Social Image Sizer

You might also like

& HTML EntitiesDeveloper↓ Markdown PreviewText