SEO Tool

Meta Tag Generator

Generate complete SEO meta tags, Open Graph tags, Twitter Cards, and JSON-LD with live SERP and social share previews.

Tags generated
Title
Description
Basic SEO
Comma-separated. Google ignores this but some other engines use it.
The preferred URL for this page. Prevents duplicate content issues.
Open Graph (Facebook, LinkedIn)
Recommended: 1200×630 px, max 8 MB. Facebook requires minimum 200×200 px.
Twitter / X Card
summary_large_image: 1200×628 px recommended. summary: min 144×144 px.
Additional Tags
Controls browser chrome color on mobile (Chrome, Samsung Browser).

        

        
Google Search Preview
Actual display varies by device, query, and Google's rendering decisions.
Social Share Preview
Preview approximates Facebook/LinkedIn link cards. Twitter/X uses a similar layout.

Meta Tag Reference

What each generated tag does and why it matters.

Essential SEO Tags
<title>Page title — shown in browser tab and Google results
descriptionSnippet shown under title in search results (150–160 chars)
canonicalPreferred URL — prevents duplicate content penalties
robotsControls crawling and indexing behaviour
charsetCharacter encoding — always UTF-8
viewportControls layout on mobile — required for responsive design
Open Graph Tags
og:titleTitle shown in social share card
og:descriptionDescription in social share card
og:imagePreview image — 1200×630 px recommended
og:urlCanonical URL for the shared object
og:typeContent type: website, article, product…
og:site_nameYour site's display name in the card
Twitter Card Tags
twitter:cardCard layout: summary, summary_large_image, app, player
twitter:titleTitle in Twitter link preview
twitter:descriptionDescription in Twitter link preview
twitter:imageImage in Twitter link preview
twitter:site@handle of the website
twitter:creator@handle of the content creator
Robots Values
indexAllow page to appear in search results
noindexExclude page from search results
followFollow links on this page
nofollowDo not follow links on this page
noarchiveDo not cache/archive this page
nosnippetDo not show a description snippet

How to Use This Tool

Generate, preview, and deploy your meta tags in minutes.

1
Fill in Basic SEO
Enter your page title (50–60 chars), meta description (150–160 chars), canonical URL, and robots setting. The character counters turn green when you're in the optimal range.
2
Configure Open Graph
Add your OG image URL (1200×630 px), site name, and OG type. Leave OG title and description blank to automatically inherit your SEO title and description.
3
Set Up Twitter Cards
Choose your card type (summary_large_image for most pages), add your @handle, and optionally override the image. Twitter will fall back to OG values if specific Twitter tags are omitted.
4
Check the Previews
Switch to SERP Preview to see how your page looks in Google search results, or Social Preview to see the Facebook/LinkedIn share card.
5
Copy the Tags
Click Copy All Tags to copy the complete HTML block, then paste it inside the <head> section of your page. Switch to JSON-LD tab to copy structured data as well.
6
Validate After Publishing
After deploying, test with Google's Rich Results Test, Facebook's Sharing Debugger, and Twitter's Card Validator to confirm everything renders correctly on live URLs.

What's Built In

A complete meta tag workbench — no sign-up, nothing sent to a server.

🔍
SERP Preview
See exactly how your page title and description will look in Google search results.
📱
Social Share Preview
Live Facebook/LinkedIn card preview showing your OG image, title, and description.
📏
Character Validation
Live counters for title (60 chars) and description (160 chars) with green/yellow/red status.
🌐
Open Graph
Complete og: tags for Facebook, LinkedIn, Pinterest, WhatsApp, and any OGP-compatible platform.
🐦
Twitter Cards
All four card types — summary, summary_large_image, app, and player.
📋
JSON-LD Output
Schema.org structured data for WebPage and Article types — ready to paste in a script tag.
🎨
Syntax Highlighted
Output code is colour-highlighted for easy reading — tag names, attributes, and values in different colours.
🔒
100% Private
All generation happens in your browser. Your URLs, titles, and descriptions never leave your device.

Frequently Asked Questions

Common questions about meta tags and how to use them.

No. Google officially stopped using the keywords meta tag for ranking in 2009. It's kept in this generator for completeness (some niche search engines still read it) but you shouldn't spend time optimising it for Google. Focus on the title, description, and actual page content instead.

Google truncates snippets at roughly 155–160 characters on desktop and around 120 characters on mobile. Aim for 150–160 characters. More important than hitting an exact number is writing a description that accurately describes the page and gives searchers a clear reason to click. Google may rewrite your description entirely if it decides a different excerpt from your page is more relevant to the query.

The canonical tag (<link rel="canonical">) tells search engines which URL is the "official" version of a page when the same content is accessible at multiple URLs. Common use cases: HTTP and HTTPS versions of the same page, www and non-www versions, URLs with query parameters (e.g. tracking parameters), paginated pages. Set the canonical to the URL you want to appear in search results. If your page has a single clean URL with no duplicates, still include a self-referencing canonical — it's a best practice that prevents issues down the line.

Open Graph was created by Facebook and is now used by most platforms (LinkedIn, Pinterest, WhatsApp, Slack). Twitter created its own twitter: tag system. Most platforms will fall back to OG tags if Twitter-specific tags are absent, which is why this tool makes OG tags required and Twitter-specific ones optional overrides. The main reason to set explicit Twitter tags is if you want a different image or description for Twitter specifically.

The recommended size is 1200×630 pixels (1.91:1 aspect ratio) — this covers Facebook, LinkedIn, Twitter summary_large_image, and most other platforms. File size should be under 8 MB; Facebook enforces a minimum of 200×200 pixels and recommends at least 600×315. Use PNG or JPG. Avoid text too close to the edges — platforms may crop or overlay elements on your image.

JSON-LD (JavaScript Object Notation for Linked Data) is a way to embed structured data in a <script type="application/ld+json"> tag. Google uses it to power rich results — star ratings, FAQ dropdowns, breadcrumbs, event cards, and other enhanced SERP features. It's separate from and complementary to meta tags. Meta tags control how your page looks in regular search results; JSON-LD unlocks rich results. For most pages, adding basic WebPage or Article JSON-LD is worth the few minutes it takes.

Use these official validators on your live URL: Google Search Console → URL Inspection tool shows how Google sees your page. Google Rich Results Test (search.google.com/test/rich-results) validates structured data. Facebook Sharing Debugger (developers.facebook.com/tools/debug) validates OG tags and lets you force a cache refresh. Twitter Card Validator (cards-dev.twitter.com/validator) validates Twitter Cards. LinkedIn Post Inspector (linkedin.com/post-inspector) validates OG tags for LinkedIn. Always test with real deployed URLs — these tools can't reach localhost.

Yes. Every page should have a unique title and description that accurately reflects its specific content. Duplicate meta tags across multiple pages is a common SEO mistake — it confuses search engines about which page to rank for a given query. The canonical tag handles technical URL duplication; unique meta tags handle content differentiation. If you have hundreds of pages, use page templates that dynamically generate titles and descriptions from the page content rather than setting them manually.

The robots meta tag gives page-level instructions to search engine crawlers. index, follow is the default — no tag needed. noindex removes the page from search results (useful for admin pages, thank-you pages, staging environments). nofollow tells crawlers not to follow links on the page. noarchive prevents Google from showing a cached version. Note: the robots meta tag only works if crawlers can reach the page. If you block the URL in robots.txt, crawlers won't see the meta tag either.

Paste all generated tags inside the <head> element of your HTML, before the closing </head> tag. The <title> tag and charset / viewport meta tags should come first. For CMS platforms: in WordPress, plugins like Yoast SEO or Rank Math handle this for you. In Shopify, edit the theme.liquid file's <head> section. In Webflow, paste into the page settings "Head Code" field. In Next.js, use the <Head> component from next/head.

Related Tools

View all →

Related Articles

View all →