Meta Tag Generator — HTML, Open Graph & Twitter Card
Fill in a short form and get a copy-ready <head> block of SEO, Open Graph and Twitter/X Card tags — with live Google, Facebook and X previews and length checks. Everything runs in your browser; nothing is uploaded.
How it works
This is a deterministic template generator, not a numeric calculator: every tag is a pure function of what you type. It follows four specifications — the Open Graph Protocol (ogp.me), the X (Twitter) Cards documentation, Google Search Central, and the WHATWG HTML standard — and emits tags in a sensible <head> order.
- Sanitise inputs. Every value is HTML-escaped (
&,<,>,") so a title containing punctuation can never break the markup. Whitespace is trimmed and your X handle is normalised to a single leading@. - Core HTML tags. With the charset option on, it outputs
<meta charset="utf-8">and the viewport meta first, then the title, meta description and canonical link. - Robots directive. Your index/noindex and follow/nofollow choices are joined into a single supported
<meta name="robots">value. Only tokens Google documents are offered. - Open Graph block. The four properties ogp.me marks required —
og:title,og:type,og:urlandog:image— are emitted, with og:image dropped (and a warning shown) when no image URL is given. og:description, og:site_name and og:locale are added when present. - Twitter/X block. Because X falls back to Open Graph, only a few Twitter tags are written — the card type, title, description and image — so they never contradict the OG block.
- Length checks.Title and description meters compare character count against thresholds from Google's title-link and snippet guidance (title green up to 60, description ideal 140–160). Google actually measures pixel width, so these are advisory heuristics, not guarantees.
As a credibility cross-check, the generated string is then independently re-parsed: the tool counts the emitted <meta>/<link>/<title> tags and confirms which of the four required Open Graph properties are present. That re-parse must agree with the validation panel — if og:image is missing, both flag it.
Worked examples
Frequently asked questions
Sources & references
- The Open Graph Protocol — ogp.me (required/optional properties, og:type vocabulary)
- X (Twitter) Cards — markup, card types and Open Graph fallback
- Google Search Central — title links and snippet length guidance
- Google Search Central — robots meta tag (supported directives)
- WHATWG HTML Standard — the meta element, charset and viewport
The tag set, required-property list and length heuristics were last cross-checked against these sources on 2026-06-25. Validate your live page afterwards with the official Facebook Sharing Debugger and X Card Validator.
Related tools
Comments & feedback
Spotted a bug or want an improvement? Tell us — our team reviews every comment, and good ideas get built. Comments are public and anonymous.
Found a bug, edge case, or want to suggest an improvement?
Email me at [email protected] — most fixes ship within 24 hours.