Meta Tag Generator

Create perfect Open Graph and Twitter Card tags with live previews

0/60 characters
0/160 characters
Recommended: 1200x630px, PNG or JPG

Generated Code

<!-- Open Graph -->
<meta property="og:type" content="website" />

<!-- Twitter Card -->
<meta name="twitter:card" content="summary_large_image" />

Paste this inside the <head> section of your HTML.

What are meta tags?

Writing meta tags by hand is tedious and error-prone. You have to remember the correct property names, keep track of character limits for each platform, ensure your image URLs are absolute, and test across multiple platforms to verify everything renders correctly.

This generator handles all of that. Fill in your page details — title, description, image URL, page URL, and site name — and see exactly how your link will appear on Google, Twitter, Facebook, LinkedIn, Slack, and Discord as you type. The generated code includes both Open Graph tags (used by most platforms) and Twitter Card tags (for optimal display on X/Twitter).

Once you're happy with the previews, copy the generated HTML and paste it into your page's <head> section. For framework-specific implementations, check our guides for Next.js, WordPress, and other platforms.

Frequently Asked Questions

What meta tags do I need for social media?

At minimum, you need og:title, og:description, og:image, og:url, and og:type for Open Graph (used by Facebook, LinkedIn, WhatsApp, Slack, Discord, Pinterest, Telegram). For Twitter, add twitter:card, twitter:title, twitter:description, and twitter:image. Our generator creates both sets automatically.

Where do I put the generated meta tags?

Paste the generated code inside the <head> section of your HTML, before the closing </head> tag. In Next.js, use the metadata export instead. In WordPress, use a plugin like Yoast SEO. The tags must be in the server-rendered HTML — client-side injection won't work for social crawlers.

What's the difference between og:title and the <title> tag?

The <title> tag is used by search engines and browser tabs. og:title is used by social platforms for link previews. They can be different — your <title> might include your brand name for SEO, while og:title can be shorter and more clickable for social sharing.

Do I need both Open Graph and Twitter Card tags?

Twitter will fall back to OG tags if Twitter-specific tags are missing. However, having both gives you more control — you can use a different image or description for Twitter than for other platforms. Our generator creates both sets so you're covered everywhere.

What image size should I use for og:image?

Use 1200x630 pixels (1.91:1 ratio) as your default — it works well on most platforms. Use absolute HTTPS URLs, keep file size under 1MB, and stick to JPEG or PNG format. Specify og:image:width and og:image:height for faster rendering.

Can I preview my meta tags before publishing?

Yes! This generator shows live previews as you type. For checking tags on an already-published page, use our OG Checker at unfurli.com — it fetches the live page and shows how it actually renders on 9 platforms.

Related tools