Meta Tag Generator
Build the whole <head> block — title, description, canonical, Open Graph, Twitter card, favicons and JSON-LD — with live Google and social previews.
Basic tags
Open Graph (Facebook, LinkedIn, Slack, Discord)
Twitter / X card
Structured data (JSON-LD)
Google result preview
Social card preview
Generated <head> tags
How to generate meta tags
- Fill in the title, description and canonical URL. The Google preview on the right shows roughly how the result is cut off in search results.
- Add an Open Graph image (1200×630 works everywhere) plus a Twitter card type, and check the social preview underneath.
- Pick a JSON-LD template if you want structured data, then copy the whole block and paste it inside your page's
<head>.
FAQ
How long should the title and description be?
Google renders roughly 580 px of title — about 55–60 Latin characters, or around 30 Chinese characters — and about 155–160 characters of description. The counters turn amber once you pass that, but longer text is not an error: it is simply truncated with an ellipsis.
Do I need both Open Graph and Twitter tags?
Not always. X/Twitter falls back to og:title, og:description and og:image when the matching twitter: tags are missing, so the one thing worth setting explicitly is twitter:card, which decides between a small thumbnail and a large banner. Facebook, LinkedIn, Slack, WhatsApp and Discord all read the Open Graph tags.
Where does the JSON-LD go?
Anywhere in the document — <head> is the usual place. It is a separate <script type="application/ld+json"> block, so it does not affect rendering. Test it with Google's Rich Results Test before you rely on it.