Meta Tags Generator
Fill in your page details and copy a complete HTML head: title, meta description, canonical, robots, Open Graph, and Twitter card tags, with a live Google search preview.
A one or two sentence summary of the page that makes someone want to click through from Google.
<!-- Primary meta tags --> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Your Page Title: What the Page Does</title> <meta name="description" content="A one or two sentence summary of the page that makes someone want to click through from Google."> <meta name="robots" content="index, follow"> <link rel="canonical" href="https://example.com/page"> <!-- Open Graph (Facebook, LinkedIn, Slack, Discord) --> <meta property="og:type" content="website"> <meta property="og:title" content="Your Page Title: What the Page Does"> <meta property="og:description" content="A one or two sentence summary of the page that makes someone want to click through from Google."> <meta property="og:url" content="https://example.com/page"> <meta property="og:site_name" content="Your Site"> <meta property="og:locale" content="en_US"> <meta property="og:image" content="https://example.com/og-image.png"> <!-- Twitter / X card --> <meta name="twitter:card" content="summary_large_image"> <meta name="twitter:title" content="Your Page Title: What the Page Does"> <meta name="twitter:description" content="A one or two sentence summary of the page that makes someone want to click through from Google."> <meta name="twitter:image" content="https://example.com/og-image.png">
Paste this inside your page's <head> element.
Tags deployed? Confirm they resolve the way crawlers see them with the Open Graph Preview & Checker. Need the og:image itself? ScreenshotRender renders 1200×630 social images from any URL or HTML template through its API.
Free, no sign-up. Everything is generated in your browser.
01 · How it works
Describe your page
Enter the title, description, URL, and social image for the page. Character counters keep the title and description inside Google's display limits.
Copy the generated tags
The full head snippet updates live as you type: SEO tags, robots, canonical, Open Graph, and Twitter card tags in one block. One click copies it.
Paste and validate
Paste the snippet inside your page's head element, deploy, and confirm everything resolves with our Open Graph Preview & Checker.
What is a meta tag generator?
A meta tag generator turns a short form (your page's title, description, URL, and image) into the exact HTML tags search engines and social platforms read. Instead of remembering which attribute goes on which tag, whether it's name or property, and which lengths Google truncates, you fill in the fields once and copy a complete, valid head snippet.
This generator builds the full set in one pass: the title tag, meta description, robots directive, canonical link, viewport and charset tags, plus the Open Graph and Twitter card tags that control how the page looks when it's shared. Everything runs in your browser, and nothing is stored.
What are meta tags in HTML?
Meta tags are <meta> elements placed inside a page's <head>. They don't render on the page; they describe the page to machines: search engine crawlers, browsers, and the social platforms that build link previews.
Most follow one of two shapes. Standard tags use a name attribute, like <meta name="description" content="...">. Open Graph tags use a property attribute instead, like <meta property="og:title" content="...">. A few close relatives live in the head too, like the <title> element and the canonical <link>, and this generator includes them because search engines treat the whole group as one unit.
The meta tags that actually matter
You could add dozens of meta tags, but crawlers only act on a handful. These are the ones worth setting on every page, and the ones this generator outputs:
- <title>: the headline in Google results and the browser tab. The strongest on-page signal in the group.
- meta description: the snippet text under your title in search results. Not a ranking factor, but it decides clicks.
- meta robots: tells crawlers whether to index the page and follow its links.
- canonical link: declares the preferred URL when the same content is reachable at several addresses.
- meta viewport: makes the page render correctly on phones; required for mobile-first indexing.
- meta charset: declares the text encoding, almost always
utf-8. - og:title, og:description, og:image, og:url, og:type: the Open Graph set that controls link previews on Facebook, LinkedIn, Slack, Discord, and WhatsApp.
- twitter:card: X (Twitter)'s layout switch;
summary_large_imagegets you the big image card. - meta author and theme-color: optional niceties: attribution and the mobile browser UI tint.
Title tag length and meta description length
Google truncates by pixel width, not characters, but the safe rules of thumb are 50 to 60 characters for the title tag and 150 to 160 characters for the meta description. Go longer and the end gets cut with an ellipsis, usually right where your call to action was.
The generator's counters track both limits as you type. Front-load the keyword and the value proposition: Google bolds query matches in both the title and description, and bolded snippets earn measurably more clicks.
If writing the description itself is the hard part, our Meta Description Generator drafts one from your page content and keeps it inside the limit.
Open Graph meta tags for social sharing
Open Graph tags decide what the link card looks like when your page is shared on Facebook, LinkedIn, Slack, Discord, WhatsApp, and most other platforms. The required set is og:title, og:type, og:image, and og:url, and you should add og:description and og:site_name in practice.
The image is the tag that goes wrong most often: it must be an absolute HTTPS URL, ideally 1200×630 pixels. If you don't have one, design and download a correctly sized card with the free OG Image Generator, or render one automatically from any URL with the ScreenshotRender API.
Twitter card meta tags
X (Twitter) reads its own twitter: tags first and falls back to Open Graph for anything missing, so you rarely need the full duplicate set. The one tag you must set is twitter:card: the value summary_large_image renders the large edge-to-edge image card, while summary shows a small square thumbnail.
This generator emits twitter:card, mirrors your title, description, and image into the twitter: equivalents, and adds twitter:site if you provide your handle, so the card attributes cleanly to your account.
The robots meta tag: index, noindex, follow, nofollow
The robots meta tag tells crawlers what they may do with the page. It takes comma-separated directives: index or noindex controls whether the page can appear in search results, and follow or nofollow controls whether crawlers follow the page's links.
A missing robots tag means index, follow, so you only strictly need it when restricting something: noindex, follow is the usual choice for thin or duplicate pages you want out of the index while keeping link equity flowing. Be careful with noindex, nofollow: it cuts the page and everything it links to out of the crawl.
Viewport, charset, and canonical tags
Three technical tags round out a correct head. The viewport tag, <meta name="viewport" content="width=device-width, initial-scale=1">, makes the page scale properly on phones; without it, mobile browsers render a zoomed-out desktop layout, and Google indexes your site mobile-first.
The charset tag, <meta charset="utf-8">, declares the text encoding and must appear within the first 1024 bytes of the document, which is why it belongs at the very top of the head.
The canonical link, <link rel="canonical" href="...">, names the one true URL for the page's content. Set it whenever the same content is reachable with tracking parameters, with and without a trailing slash, or over http and https, so ranking signals consolidate on a single address.
Do meta keywords still matter?
No. Google confirmed back in 2009 that it ignores the <meta name="keywords"> tag entirely, and Bing has said stuffing it can even act as a spam signal. No major search engine uses it for ranking today.
That's why this generator doesn't emit one. The word "keywords" survives in SEO tooling as a targeting concept, but as an HTML tag it's dead weight: it reveals your keyword strategy to competitors and offers nothing in return.
Meta tags and SEO: what actually moves rankings
It helps to separate ranking signals from click signals. The title tag is a genuine, confirmed ranking factor, and the robots and canonical tags directly control what gets indexed. Those three do the SEO heavy lifting.
The meta description and the social tags don't move rankings directly, but they move humans: a sharp description lifts click-through rate in search results, and complete Open Graph tags lift shares and referral traffic. Both feed back into performance, which is why the full set belongs on every page you care about.
How to add meta tags to your website
Paste the generated snippet inside the <head> element of your page, before any scripts or styles if possible (the charset tag in particular should come first). Each page should get its own unique title, description, and og:url; only the viewport, charset, and site-wide tags stay identical across pages.
In most stacks you won't touch raw HTML: WordPress users can paste the values into an SEO plugin like Yoast or Rank Math, Next.js has a metadata API that renders the same tags, and most other frameworks expose a head or meta helper. The generated snippet still serves as the reference for exactly which values to set.
After deploying, confirm the tags resolve the way crawlers see them with our Open Graph Preview & Checker: it fetches the live page and flags anything missing or malformed.
More free tools
Favicon Checker & Grabber
Find, preview, and download any website's favicons.
Full Page Screenshot
Capture the entire scrolling webpage of any URL.
HTML to Markdown Converter
Turn raw HTML or any URL into clean Markdown.
Meta Description Generator
Write and preview your meta description with a live SERP snippet.
OG Image Generator
Design and download a 1200×630 Open Graph image for any page.
Open Graph Preview & Checker
Test how any URL looks when shared on social media.
Twitter/X Card Generator & Preview
Generate twitter: meta tags and preview your X card live.
Webpage to Image
Turn any public URL into a downloadable image.
FAQ
Common questions
Everything about the Meta Tags Generator.
Common questions
A meta tag generator is a tool that turns a simple form into ready-to-paste HTML meta tags. You enter your page's title, description, URL, and social image, and it outputs the complete head snippet: title tag, meta description, robots, canonical, viewport, charset, Open Graph, and Twitter card tags, correctly formatted and escaped.
Meta tags are elements inside a page's head section that describe the page to machines instead of rendering visible content. Search engines read them to build result snippets and decide indexing, browsers read them for encoding and mobile scaling, and social platforms read them to build link preview cards.
Every indexable page should have a unique title tag, a meta description, a viewport tag, a charset declaration, and a canonical link. Add a robots meta tag when you need to restrict indexing, and Open Graph plus twitter:card tags so shared links render a proper preview. That set covers everything major crawlers act on.
Yes, but unevenly. The title tag is a confirmed ranking factor, and robots and canonical tags directly control indexing. The meta description does not affect rankings but strongly affects click-through rate from search results. Open Graph tags do not affect rankings either, but they drive social clicks and referral traffic.
Keep it between 50 and 60 characters. Google truncates titles by pixel width, around 600 pixels, and 60 characters is the practical safe limit before the end gets cut off with an ellipsis. Put the keyword and the page's main value near the front so they survive any truncation.
Aim for 150 to 160 characters. Google typically shows about 155 to 160 characters on desktop and slightly fewer on mobile before truncating. Shorter is fine if it says everything; going far over the limit just means Google cuts it mid-sentence or writes its own.
No. Google announced in 2009 that the meta keywords tag is ignored for ranking, and it has never reversed that. Bing has described a stuffed keywords tag as a possible spam signal. This generator deliberately does not output one, because it only exposes your keyword targets to competitors.
All meta tags belong inside the head element, between the opening head tag and the closing one. The charset declaration should come first, within the first 1024 bytes of the document. Meta tags placed in the body are invalid and most crawlers will not reliably read them.
The robots meta tag tells search engine crawlers what they may do with a page. Its content combines index or noindex, which controls whether the page appears in search results, with follow or nofollow, which controls whether the crawler follows the page's links. If the tag is absent, crawlers assume index, follow.
The viewport meta tag, with content width=device-width, initial-scale=1, tells mobile browsers to render the page at the device's actual width instead of a zoomed-out desktop layout. It is essential for responsive design, and because Google indexes sites mobile-first, a page without it usually underperforms on mobile search.
Open Graph tags are meta tags with a property attribute starting with og:, like og:title, og:description, og:image, og:url, and og:type. Facebook, LinkedIn, Slack, Discord, WhatsApp, and most other platforms read them to build the link preview card when your page is shared. X (Twitter) reads them as a fallback behind its own twitter: tags.
The easiest way is an SEO plugin such as Yoast SEO or Rank Math: each page gets fields for the title, meta description, and social image, and the plugin renders the tags for you. Without a plugin, you can add tags to your theme's header.php, but plugin fields are safer and survive theme updates. Use this generator's output as the reference for which values to fill in.
They are the same thing in practice. The title element is technically not a meta tag, it is its own HTML element in the head, but SEO tools commonly call it the meta title. It sets the headline in search results and the browser tab label, and it is the strongest on-page signal among the head tags.
Yes, and it does so often. When Google judges that your description does not match the searcher's query, it generates its own snippet from the page content. You still control the default shown for your main queries, so a well-written description is worth it: pages with strong descriptions get rewritten less and clicked more.
No. The Meta Tags Generator is completely free and needs no account. All tags are generated locally in your browser as you type, and nothing you enter is uploaded or stored.
Get Started
Need to generate og:images at scale?
ScreenshotRender renders pixel-perfect 1200×630 social images from any URL or HTML template. Start free with 100 screenshots, no credit card.
Want to integrate via API? Get your key here