Meta Tag Generator
Build the title, description, canonical, Open Graph and Twitter tags for your page head, with a live Google preview.
Generate meta tags and preview them in Google
This meta tag generator turns a few form fields into the HTML you paste into a page's <head>: the title, meta description, canonical link, robots directive, viewport, charset, Open Graph tags and a Twitter card. While you type, you see how the page might look as a Google result on desktop and on mobile. Everything runs in your browser and nothing is sent anywhere.
How to use it
- Type the page title and meta description. The counters turn red when you pass the recommended limits.
- Add the canonical URL (a full address starting with https://). The preview uses it for the small breadcrumb line above the title.
- Choose a robots value if you need one, set the charset and language code, and keep or untick the viewport tag.
- Fill in the Open Graph fields (image, site name, type) and pick a Twitter card type.
- Click Copy and paste the snippet into the head of your page.
Limits the counters use
| Field | Limit in the tool | Why |
|---|---|---|
| Title | 60 characters, about 580 px | Google cuts titles by pixel width, so wide letters use up space faster |
| Description | 155 characters | Longer text is often shortened in the snippet |
The pixel figure is an estimate based on Arial at 20 px, not a measurement from Google. Google can also rewrite titles and descriptions, so treat the preview as a guide, not a guarantee.
What goes into the output
<meta charset>and the viewport tag (width=device-width, initial-scale=1).<title>,meta name="description",meta name="robots"andlink rel="canonical".og:type,og:title,og:description,og:url,og:imageandog:site_name. If you leave og:title, og:description or og:url empty, the tool reuses the title, description and canonical URL.twitter:card,twitter:site,twitter:title,twitter:descriptionandtwitter:image(title, description and image come from the Open Graph values).- Quotes, ampersands and angle brackets in your text are escaped, so the snippet stays valid HTML.
Empty fields are left out of the snippet. The language code cannot live in the head, so it is printed as a comment reminding you to set it on your <html> tag.
Tips
- Put the main keyword near the start of the title so it is not cut off.
- Use noindex only on pages you really want kept out of search results.
- Open Graph images work best at 1200 × 630 px and must be reachable by a public URL.
- To check how a shared link looks on social networks, try the OG preview tool.
Frequently asked questions
How long should a title tag be?
Aim for about 60 characters or less. Google truncates by pixel width (roughly 580 px on desktop), so a title full of wide letters like W or M can be cut earlier than one full of narrow letters.
How long should a meta description be?
Around 155 characters is a common target. Google may show a different snippet taken from the page, so write a description that is useful on its own rather than stuffing it.
Does the tool send my text to a server?
No. The snippet and the preview are built in your browser as you type.
Is the Google preview exact?
No. It shows how a result is likely to look and where it may be cut, using an estimated pixel width. The real result depends on Google's own choices.
Related Developer Tools
Browse all tools from the same category.
Domain Authority Checker
Check Moz authority, page authority, spam score, and backlink metrics
Open toolSEO Audit Tool
Audit a website URL for technical SEO, metadata, headings, broken internal links, hreflang, canonical and X-Robots-Tag checks, with report exports
Open toolShowing 1-2 of 48