Meta / OG Tag Generator
A meta tag generator builds the exact HTML tags that control how a page appears in Google search results and when it's shared on social media. Fill in your page details and get accurate title, meta description, Open Graph and Twitter Card tags — with a live Google search preview and social card preview as you type.
1 Fill in your page details
2 Copy your code
Why meta tags and Open Graph tags matter
Your title tag and meta description are what people actually see and click on in Google search results — they're your pitch, not just metadata. Open Graph and Twitter Card tags control the exact same thing for social platforms: the title, description, and image that show up when someone shares your link on Facebook, LinkedIn, Slack, or X.
Get them wrong and two things happen: search results show a truncated or auto-generated snippet instead of the one you wrote, and shared links look broken or generic instead of using your image and copy. Both are quiet conversion killers that have nothing to do with rankings and everything to do with click-through rate. If you also want your page recognized as a specific entity type (not just a title and description), pair this with the JSON-LD Schema Generator.
For example, a filled-in title and description produce:
<title>Frost Rank | Free SEO Tools</title>
<meta name="description" content="Free SEO tools, no signup.">
<meta property="og:title" content="Frost Rank | Free SEO Tools">
<meta property="og:image" content="https://frostrank.com/og-image.png">How to use this tool
-
1
Write the title and description
Enter the page title and meta description. A counter under each shows how close you are to the length search results usually display.
-
2
Set the canonical URL and robots
Use the page's full, final URL as the canonical, and leave robots on "index, follow" unless the page should stay out of search results.
-
3
Add the social details
Fill in the OG image URL, site name, OG type and Twitter Card type. Social title and description are optional and fall back to the page title and meta description.
-
4
Copy the tags
Click "Copy code" to copy the complete block of tags.
-
5
Paste and test
Paste the tags into the page's head section, publish, then check the preview with each platform's sharing debugger.
Common use cases
- Writing tags for a new page or landing page before it launches.
- Fixing a link that shows the wrong image, or no image, when shared on Facebook, LinkedIn, Slack or WhatsApp.
- Rewriting the meta description of a page that ranks but earns few clicks.
- Setting noindex on pages that should not appear in search, such as thank-you pages or internal search results.
- Building a consistent tag template for a CMS theme or static site.
Tips and common mistakes
- Use absolute URLs. A relative image path such as
/images/share.pngis ignored by most social platforms; the OG image and canonical need the full address, including https://. - Size the image for large cards. An image of at least 1200 × 630 pixels (a 1.91:1 ratio) displays as a large preview instead of a small thumbnail.
- Clear the platform's cache. Social networks store previews, so after changing tags, re-scrape the URL in the platform's debugger or the old preview keeps appearing.
- noindex needs a crawlable page. If robots.txt blocks the URL, search engines never see the noindex tag. Check that with the Robots.txt / Sitemap Validator, and draft copy that fits in the Word & Character Counter. The Open Graph and meta tags guide has the full reference.
Frequently asked questions
Open Graph is a protocol, introduced by Facebook in 2010, that lets a web page describe how it should look when its link is shared. Facebook, LinkedIn, Slack, Discord and WhatsApp read it to build the preview card, with its title, description and image, instead of guessing from the page content. Read the full Open Graph and meta tags guide.
They are the meta tags with an og: property in a page's head that carry its Open Graph data. The protocol requires four: og:title, og:type, og:image and og:url, while og:description and og:site_name are common optional extras. This tool writes all six, plus Twitter Card tags, the meta description and a canonical link. See how each Open Graph field works.
Roughly 50–60 characters for a title and 150–160 for a description before Google starts truncating it in search results — which is exactly what the character counters in this tool track as you type.
Open Graph (og:*) tags are the standard most platforms read — Facebook, LinkedIn, Slack, Discord. Twitter/X has its own twitter:* tags, but it also falls back to Open Graph tags if Twitter-specific ones are missing, which is why this tool lets Twitter fields inherit from your OG title and description by default.
Almost always a caching issue on the platform's side, not your tags. Facebook, LinkedIn and X each cache a link's preview the first time it's shared and won't refetch it automatically — use Facebook's Sharing Debugger or LinkedIn's Post Inspector to force a re-scrape after you update your tags.
Yes, if you want reliable previews everywhere. Open Graph alone will render on most platforms, but explicit Twitter Card tags — especially summary_large_image — give you a full-width image preview on X instead of a small thumbnail.
Yes, completely free with no signup. Everything runs in your browser — the fields you fill in are never sent to a server.
Builds title, meta description, Open Graph and Twitter Card tags to the current platform specs from Google, Facebook and X — with previews modeled on how these platforms actually render shared links, not a generic mockup, based on real campaigns audited and fixed.
Was this tool helpful?
Rate it and leave a comment — takes 10 seconds, and genuinely helps decide what to fix or build next.