Meta Tag Generator
Generate SEO meta tags, Open Graph, and Twitter cards.
Recommended tools
Affiliate links — we may earn a commission if you sign up.
About the Meta Tag Generator
The Meta Tag Generator assembles a complete, paste-ready block of HTML meta tags for a page's head section — standard SEO tags, Open Graph tags for social sharing, and Twitter Card tags for X previews — from one single form. You type the page title, meta description, comma-separated keywords, canonical URL, OG image URL, and Twitter handle once, and the tool returns valid HTML with nothing duplicated across the three standards. Why this matters for search rankings: the title and meta description are still the first thing a searcher reads on the results page, and they directly influence click-through rate. The generator helps you keep them safe. A live counter flags the description as soon as it crosses 160 characters, and the title field caps input at 120. The output is also escape-proof: ampersands, quotes, and angle brackets are converted automatically, so pasting the block into a template cannot break your markup. A selector sets the Open Graph type to website, article, product, or profile, and the Twitter handle field normalizes handles with or without the leading @ symbol. Everything updates as you type, a Reset button clears the form in one click, and the finished block downloads as meta-tags.html.
Examples
Page title: "The Ultimate Guide to Sustainable Coffee" · Meta description: "A practical guide to choosing and brewing sustainable coffee at home." · Keywords: "coffee, sustainable, brewing, fair trade" · Canonical URL: "https://example.com/coffee-guide" · OG image: "https://example.com/og-image.png" · Twitter handle: "@yourbrand" · Open Graph type: Website
<title>The Ultimate Guide to Sustainable Coffee</title> <meta name="description" content="A practical guide to choosing and brewing sustainable coffee at home." /> <meta name="keywords" content="coffee, sustainable, brewing, fair trade" /> <link rel="canonical" href="https://example.com/coffee-guide" /> <!-- Open Graph --> <meta property="og:title" content="The Ultimate Guide to Sustainable Coffee" /> <meta property="og:description" content="A practical guide to choosing and brewing sustainable coffee at home." /> <meta property="og:image" content="https://example.com/og-image.png" /> <meta property="og:url" content="https://example.com/coffee-guide" /> <meta property="og:type" content="website" /> <!-- Twitter Card --> <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:title" content="The Ultimate Guide to Sustainable Coffee" /> <meta name="twitter:description" content="A practical guide to choosing and brewing sustainable coffee at home." /> <meta name="twitter:image" content="https://example.com/og-image.png" /> <meta name="twitter:site" content="@yourbrand" /> <meta name="twitter:creator" content="@yourbrand" />
Page title: "Ceramic Pour-Over Mug | Fernandes Goods" · Canonical URL: "https://example.com/shop/pour-over-mug" · Open Graph type: Product · Twitter handle: "fernandesgoods" (no @)
<title>Ceramic Pour-Over Mug | Fernandes Goods</title> <link rel="canonical" href="https://example.com/shop/pour-over-mug" /> <!-- Open Graph --> <meta property="og:title" content="Ceramic Pour-Over Mug | Fernandes Goods" /> <meta property="og:url" content="https://example.com/shop/pour-over-mug" /> <meta property="og:type" content="product" /> <!-- Twitter Card --> <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:title" content="Ceramic Pour-Over Mug | Fernandes Goods" /> <meta name="twitter:site" content="@fernandesgoods" /> <meta name="twitter:creator" content="@fernandesgoods" />
Page title: "Coffee & Tea: A Buyer's Guide" · Meta description: "Choosing, brewing, and storing specialty coffee & tea."
<title>Coffee & Tea: A Buyer's Guide</title> <meta name="description" content="Choosing, brewing, and storing specialty coffee & tea." />
How to use
- 1
Type the page title in the Page title field. The hint under the label tracks characters against 60 and the field caps input at 120.
- 2
Write the meta description in the textarea and watch the counter. It shows your count against 160 and adds a "too long" flag past that limit.
- 3
Add comma-separated keywords and the canonical URL, then pick an Open Graph type (Website, Article, Product, or Profile) from the selector.
- 4
Paste the OG image URL and enter the Twitter handle — with or without the leading @, it is normalized for you.
- 5
Copy the generated tags from the result box or download them as meta-tags.html, then paste the block into your page's <head>.
Common use cases
- On-page setup for new blog posts — generate the full title, description, canonical, OG, and Twitter block in one pass instead of hand-writing six tags.
- E-commerce product pages — set og:type to Product and pair the emitted tags with product JSON-LD for consistent share cards across the catalog.
- Site migration checklists — regenerate tags for the new domain so old canonicals and OG URLs are not carried over by copied templates.
- Newsroom and multi-author publishing — paste the same canonical URL and brand handle across author profiles to keep og:url and twitter tags consistent.
- Agency onboarding — standardize the exact tag block every client page ships with, including the brand Twitter handle and a default OG image.
- Campaign landing pages — swap the OG image per campaign while keeping title and description inside SERP-safe lengths.
Technical SEO best practices
- Keep meta descriptions between about 120 and 160 characters; longer text gets truncated in the SERP, and the tool flags anything past 160.
- Always use absolute URLs in the canonical and og:url tags — relative canonicals are ignored by most crawlers and split your signals.
- Serve the OG image at 1200×630 so Facebook and LinkedIn render the large card instead of a cropped or missing thumbnail.
- Match the meta description to what the page actually delivers; a mismatch inflates bounce rates and invites Google to rewrite the snippet.
- Let the generator escape ampersands and quotes instead of hand-escaping, where a single missed character silently breaks your HTML.
- Do not spend time optimizing the meta keywords tag — Google has ignored it for years, but the field exists for legacy CMS workflows.
Tips
- Regenerate the block whenever the canonical URL changes — an outdated og:url splits share counts across versions of the page.
- Keep a master copy of your default OG image URL in a template note so every page ships with a share image.
- Use the "too long" description flag as a rewrite prompt, not as a reason to stuff keywords back in.
- Download the output as meta-tags.html and diff it against your CMS-rendered head on staging before release.
Frequently asked questions
Explore more seo tools
Browse the full collection of seo tools on the hub, or jump back to all categories.