0 characters
0 characters (aim for 120 to 160)
1200 x 630 JPG or PNG works on every platform
Goes on the html element, e.g. en or en-GB
Browser toolbar on phones and Discord embeds
Google ignores meta keywords; some site search tools still read them
Previews are close approximations. Each app changes its layout by device and version, and caches a link card after the first share.
<meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <title></title> <!-- Open Graph (Facebook, LinkedIn, WhatsApp, Slack, Discord) --> <meta property="og:type" content="website" /> <meta property="og:title" content="" /> <!-- X (Twitter) --> <meta name="twitter:card" content="summary" /> <meta name="twitter:title" content="" />
How to use
Auto-fill from a URL or start blank
Paste a page address and click Auto-fill from URL. The fields fill from the live page, and a short list shows problems found in its current tags. Skip this for a page that is not live yet, or click Try sample.
Edit the fields and robots options
Adjust the title, description, canonical, share image, site name, X handles, language and theme colour. Tick the robots options you need, such as noindex or max-image-preview:large. A red field is wider than Google usually shows.
Check the previews and copy
Switch between the platform tabs, or open All to see every card at once. Choose HTML or Next.js metadata, then press Copy or Download and paste the result into your head or layout file.
Why Meta Tag Generator
- One form fills the title, description, robots, canonical, Open Graph and X tags, so they stay consistent.
- Title and description counters in characters and pixels, the unit Google trims by.
- Previews for Google, Facebook, X, LinkedIn, WhatsApp, Slack, Discord, Pinterest and Telegram.
- Output as plain HTML or a Next.js metadata object, ready to copy or download.
Essential meta tags and whether Google uses them
Not every tag in a typical head matters for search. The table lists the tags this generator can output, with what each one does and whether Google uses it.
| Tag | What it does | Used by Google? |
|---|---|---|
| <title> | Page title in browser tabs and search results | Yes, the main source for the result title |
| meta description | Short summary of the page | Yes, often used for the snippet, but may be replaced |
| meta robots | Allows or blocks indexing and link following | Yes |
| meta viewport | Sets the page width on phones | Yes, needed for a mobile-friendly page |
| meta charset | Declares the text encoding, usually utf-8 | Yes, to read the page correctly |
| link rel=canonical | Names the preferred URL among duplicates | Yes, as a strong hint |
| og: tags | Title, description and image for link previews | No, used by Facebook, LinkedIn, WhatsApp and others |
| twitter: tags | Card layout and content on X | No, used by X |
| meta author | Names the author | No known effect on ranking |
| meta theme-color | Colours the browser bar on phones and Discord embeds | No |
| meta keywords | A list of keywords | No, ignored since 2009 |
How the title pixel counter works
Google does not cut titles at a fixed number of characters. It cuts them when they no longer fit the width of the result, which on desktop is roughly 600 pixels. A title full of wide letters such as W and M hits that limit sooner than one full of narrow letters such as i and l. At 20 pixels, a capital W is about 19 pixels wide and a lowercase i about 4.
The counter measures your title in 20 pixel Arial, close to the font Google uses for desktop titles, using your browser's own text measuring. It measures the description in 14 pixel Arial against about 920 pixels. These are close estimates, not exact figures: Google changes its layout from time to time, and it may show a different title if it thinks yours does not match the page. Treat a red field as a sign to shorten, and a number well under the limit as a safe margin.