Meta Tag Generator
Build a copy-paste <head> block — title, description, canonical, robots, Open Graph and Twitter Card tags — with a live Google result preview and character counters.
Google result preview
www.playtools.app
Free Online Tools — PlayTools
A collection of fast, privacy-first calculators and converters that run entirely in your browser.
<title>Free Online Tools — PlayTools</title> <meta name="description" content="A collection of fast, privacy-first calculators and converters that run entirely in your browser." /> <meta name="robots" content="index, follow" /> <link rel="canonical" href="https://www.playtools.app/" /> <!-- Open Graph --> <meta property="og:title" content="Free Online Tools — PlayTools" /> <meta property="og:description" content="A collection of fast, privacy-first calculators and converters that run entirely in your browser." /> <meta property="og:type" content="website" /> <meta property="og:url" content="https://www.playtools.app/" /> <meta property="og:site_name" content="PlayTools" /> <meta property="og:image" content="https://www.playtools.app/api/og" /> <!-- Twitter --> <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:title" content="Free Online Tools — PlayTools" /> <meta name="twitter:description" content="A collection of fast, privacy-first calculators and converters that run entirely in your browser." /> <meta name="twitter:image" content="https://www.playtools.app/api/og" />
Paste these into the <head> of your page. Title and description limits (~60 and ~160 characters) are where Google typically truncates; the real cutoff is by pixel width, so treat the counters as guidance. og:image should be an absolute URL to a 1200×630 image. Nothing here is uploaded — the tags are built in your browser.
The meta tags that actually matter
A handful of tags in the HTML <head> control how a page shows up in search results and when it is shared on social platforms. The essentials are the title element, the meta description, a canonical link, a robots directive, and the Open Graph and Twitter Card sets. This tool assembles all of them from a few fields and shows a live preview of the Google result.
Title and description are the copy of your search listing. Google truncates the clickable title near 600 pixels — roughly 60 characters — and the grey snippet near 920 pixels, roughly 155–160 characters. Because the cutoff is by pixel width, capital-heavy text runs out sooner. Put the distinctive words first; a description that is cut mid-sentence still needs to have made its point.
The canonical link resolves duplication. When the same content is reachable at several URLs — with and without a trailing slash, with tracking parameters, http and https — a self-referential canonical tells search engines which one to index and credits all the ranking signals to it. Getting this wrong splits authority across near-identical pages.
Open Graph and Twitter Card tags govern the preview card when a link is posted to social media or chat apps. og:image should be an absolute URL to a roughly 1200×630 image on a publicly reachable path — social crawlers do not authenticate and do not execute JavaScript, so the tags must be in the initial HTML. X/Twitter falls back to Open Graph, so twitter:card is often the only Twitter-specific tag you need.
Everything is generated in your browser; no field you enter is sent anywhere. Values are HTML-escaped so quotes and angle brackets in a title or description will not break the markup.
Key formulas (reference)
<title>…</title> <meta name="description" content="…" /> <link rel="canonical" href="https://…" /> <meta name="robots" content="index, follow" /> <meta property="og:title" content="…" /> <!-- + og:description/type/url/site_name/image --> <meta name="twitter:card" content="summary_large_image" />
Related tools
These free tools pair well with this page — open them in a new tab to finish your workflow.
Frequently Asked Questions
Which tags does this generate?
The title element, meta description, canonical link, a robots directive, the core Open Graph properties (og:title, og:description, og:type, og:url, og:site_name, og:image) and the Twitter Card tags (twitter:card, twitter:title, twitter:description, twitter:image). Paste the block into the <head> of your page.
How long should the title and description be?
Google truncates the title link at roughly 600 pixels (about 60 characters) and the description snippet at roughly 920 pixels (about 155–160 characters). The counters flag those limits, but the real cutoff is by pixel width, so wide text runs out sooner. Front-load the important words.
Do meta descriptions affect ranking?
Not directly. Google often rewrites them anyway. A good description still matters because it is the sales pitch in the search result — a compelling one lifts click-through rate, which does influence how a page performs over time.
What is the canonical URL for?
The canonical link tells search engines which URL is the authoritative version of a page when the same content is reachable through several URLs (tracking parameters, trailing slashes, http vs https). It consolidates ranking signals onto one address and prevents duplicate-content dilution.
What size should the og:image be?
1200×630 pixels is the standard for a large social card, with an aspect ratio near 1.91:1. Use an absolute URL (https://…), keep it under about 5 MB, and make sure the file is publicly reachable — social crawlers cannot log in.
Do I still need Twitter tags if I have Open Graph?
X/Twitter falls back to Open Graph for most fields, so at minimum you only need twitter:card to choose the layout. Adding the explicit twitter:* tags lets you give X a different title, description or image from the one used elsewhere.
What does the robots meta value do?
"index, follow" is the default and can be omitted. "noindex" keeps the page out of search results; "nofollow" tells crawlers not to pass ranking signals through links on the page. Use noindex for thank-you pages, internal search results and staging content.