Meta Tag Generator

Meta tags are the hidden lines at the top of a web page that tell Google what to show in results and tell Facebook, LinkedIn, X, Slack and iMessage what card to draw when someone shares the link. Get them wrong and your page appears with a cut-off title, a random paragraph or no picture at all. This tool writes them for you and shows the result before you publish.

As you type, it measures your title and description in pixels, not just characters, because Google cuts by width: a title full of capital Ws runs out of room long before one full of i’s. The previews show the desktop and phone Google result, a Facebook or LinkedIn card, both X card styles, a Slack unfurl and an iMessage bubble. It also writes Open Graph and X tags, icon links, a theme colour and optional structured data for an organisation, website, article or product.

Already have a page? Paste its HTML and the form fills itself, so you can see what is wrong and fix it. Everything happens in your browser, and outside images are deliberately not loaded, for your privacy.

1. Type a page title and a description under “Search result” and watch the bars: green fits, orange is close, red will be cut.
2. Add the page address and, under “Social sharing”, the full address of your share image plus your site name.
3. Switch between the Google, Facebook & LinkedIn, X, Slack and iMessage tabs in “Live preview”. Press “Preview my image” to see your picture in the cards.
4. Open “Icons, colour and basics” or “Structured data (JSON-LD)” if you want icon links, a theme colour or rich-result data.
5. Press “Copy” (or “Copy tags”) and paste the result into the head of your page. To check an existing page, use “Import from existing HTML” first.

• Pixel-width meters for the title (600 px desktop limit) and description (about 920 px desktop, 680 px phone), with the exact cut-off text when it is too long.
• Google previews for desktop and phone, using the site name, address breadcrumb and Google’s fonts and sizes.
• Share card previews for Facebook and LinkedIn, X (large image and small square), Slack and iMessage.
• Open Graph tags: type, address, title, description, image with width, height and alt text, site name, locale and article date, with separate social title and description if you want them.
• X card type, site and author handles (typed as @name or pasted as an x.com link).
• Robots choices in plain words: show in results, follow links, large image previews, no snippet.
• Icon links for favicon.ico, favicon.svg, apple-touch-icon and a web manifest, plus charset, viewport and theme colour.
• JSON-LD templates for Organization, WebSite, Article and Product, with safe escaping so no text can break out of the script block.
• Import from pasted HTML, including existing JSON-LD, and warnings for relative addresses and missing product prices.
• Your form is remembered on this device, and “Start over” clears it.

• Put the words people search for near the start of the title and your brand at the end. Google may rewrite titles that look stuffed or repetitive.
• Give every page its own title and description. Duplicate ones make it harder for Google to tell pages apart.
• Use a 1200 × 630 pixel JPG or PNG under 5 MB for the share image, and keep important text away from the edges, since some apps crop to a square.
• Social apps remember a card once they have seen it. After changing tags, use the platform’s own sharing debugger to refresh its copy.
• Meta keywords are no longer used by Google, so this tool doesn’t write them.