Meta Tag Generator
Generate <title>, meta description, canonical, Open Graph, and Twitter Card tags from your page details — ready to paste into your HTML <head>. Runs entirely in your browser.
Frequently Asked Questions
What are Open Graph tags for?+
Open Graph (og:) tags control how your page appears when shared on Facebook, LinkedIn, Slack, Discord, and other platforms that render link previews. Without them, these platforms fall back to guessing a title, description, and image from the page — often with poor results. Setting og:title, og:description, and og:image explicitly gives you control over your share previews.
What is the difference between Twitter Card tags and Open Graph tags?+
Twitter (now X) reads Open Graph tags as a fallback, but its own twitter: tags take priority and support card-specific behavior like summary_large_image, which renders a large preview image. Including both og: and twitter: tags ensures consistent, high-quality previews across the most platforms with the least duplicated effort.
What image size should I use for og:image?+
The recommended size is 1200×630 pixels (a roughly 1.91:1 ratio), which displays well as a large preview card on Facebook, LinkedIn, X, and Slack. Use an absolute URL (including https://) — relative paths are not resolved correctly by most crawlers. Keep the file under 5MB and use JPG or PNG for broad compatibility.
Where do these tags go in my HTML?+
All of the generated tags belong inside the <head> element of your HTML document, before the closing </head> tag. Order does not matter for correctness, though placing the title and meta description near the top is a common convention for readability.
Related Tools
How to use
- Fill in your page title, description, URL, and (optionally) a share image.
- The HTML for your page's <head> generates instantly, including Open Graph and Twitter Card tags.
- Copy the output and paste it into your page's <head> element.
- Toggle Twitter Card tags off if your CMS already generates them.