Meta Tag Generator

How it works

On every keystroke the page rebuilds the entire tag block from your six fields. Each value is trimmed and run through an escaper that converts &, ", <, and > into HTML entities, so a title like Tom & Jerry's "Best" Page comes out as a valid attribute instead of broken markup. Tags are only emitted for fields you actually filled in, and a few decisions are made for you: leave the image URL empty and twitter:card drops from summary_large_image to plain summary, since the large-image card is pointless without an image, and a Twitter handle typed without the @ gets it prepended. The counters check the title against 60 characters and the description against 160 and turn red past the limit. Treat those as guides, not rules: Google truncates snippets by pixel width (roughly 600px for titles), not by character count, so a title full of wide letters like W and M gets cut sooner than one full of i's and l's.

One thing worth knowing that most tag generators skip: the meta description is not a ranking factor. Google has said so for years. What it does affect is click-through rate, because it is often the pitch shown under your link in results, and pages that get clicked more tend to earn their position. Even then, Google rewrites descriptions well over half the time when yours doesn't match the searcher's query. Write it for humans, keep it under 160 characters, and don't obsess. For the social image, 1200x630 is the safe choice: it matches Facebook's recommended Open Graph size and the roughly 1.91:1 crop that Twitter/X, LinkedIn, and most chat apps apply to large preview cards.

Everything happens in this page's own JavaScript: the tag string is assembled locally and only touches the network if you count the clipboard, which it doesn't use either until you press copy. Open DevTools, watch the Network tab, and type into every field. Your titles, URLs, and handles never leave the browser.