Character counts are a rough proxy for a problem that is fundamentally about pixels. Google renders a title link in a fixed width container, so a title built from narrow letters like i, l and t fits noticeably more characters before it clips than a title built from wide letters like m, w and capital W. A 60 character title can be safely inside the limit or already clipped depending entirely on which letters it uses, and no character counter alone can tell you which.
This tool measures your text the same way a browser does, using the canvas rendering context to compute the actual rendered width in the font Google uses for a search result, then applies the same cut point Google applies. Nothing is sent anywhere. The measurement happens locally using the same canvas API every browser already ships, which is what makes this a genuine google search preview rather than a character count dressed up as one.
Why pixel width beats a character count
Google truncates a title link at roughly 580 pixels on desktop and a description at roughly 920 pixels, both measured in the actual proportional font the result is rendered in, not a monospace approximation. Because letters vary in width, a rough character based rule like sixty characters for a title is only ever an approximation that happens to be right for an average sentence and wrong for anything unusual, such as a title packed with capital letters or narrow punctuation.
Measuring pixels instead of characters removes that guesswork entirely. Two titles of identical character length can render to noticeably different widths, and only a title tag pixel width measurement catches the one that is actually going to clip before you publish it.
Desktop and mobile clip at different widths
Mobile search results use a narrower container than desktop, so the same title and description that fit comfortably on a desktop result can clip earlier on a phone. This preview renders both layouts from the same input, side by side, so a title tuned only for desktop does not quietly fail for the majority of searches that now happen on mobile devices.
The breadcrumb shown above the title, built from your URL's path segments, also behaves differently across layouts. Mobile tends to show a shorter breadcrumb or the bare domain more often, while desktop has more room to show several path segments before switching to an ellipsis.
- Desktop title render width is roughly 580 pixels before truncation.
- Desktop description render width is roughly 920 pixels before truncation.
- Mobile narrows both further, so always check mobile separately rather than assuming desktop numbers apply.
- The breadcrumb is built from the URL path, not typed separately, so a clean URL structure genuinely helps here too.
Google rewrites titles and descriptions, and this preview shows the input, not the outcome
Google reserves the right to rewrite either the title or the description shown in a result when it judges that a better match for the query exists elsewhere on the page, or when your title is stuffed with keywords in a way that reads poorly. This happens on a meaningful share of results and is a known, well documented behaviour rather than a bug.
This tool shows exactly what you typed, rendered at the correct width, which is the best information available before the page is indexed. It cannot predict whether Google will choose to rewrite it for a specific query, since that decision depends on the query itself and on the page's full content, both of which are outside what a title and description alone can tell you.
Writing a title and description that survive the cut
Front load the most important words. If a title is going to clip on some devices regardless of how carefully it is written, the part that survives should be the part that matters, which means putting the specific, differentiating information first rather than a generic lead in followed by the useful part at the end.
Treat the description as a second, independent pitch rather than a summary of the title. Repeating the title's wording in the description wastes space that could instead answer the reader's likely next question or state a concrete benefit, since the two are shown together and read as a pair, not as a headline followed by its own restatement. Running the pair through a meta description preview before publishing catches wasted space like this early.
How this serp snippet preview tool measures pixel width
The measurement uses the canvas element's measureText method, called with a font string chosen to match the typeface and size Google's search results actually render in. That produces a real pixel width for your exact text rather than an approximation based on average character width, which is the same technique a browser itself uses internally to lay out any text on a page.
Because measureText is a standard browser API rather than anything installed or fetched, the measurement is available instantly and works identically whether you are online or not, with nothing about your title or description ever transmitted anywhere to produce the search result snippet shown on screen.
| Element | Desktop | Mobile |
|---|---|---|
| Title link | ~580px | ~ narrower, device dependent |
| Description | ~920px | ~ narrower, device dependent |
| Breadcrumb | Several path segments | Often domain only |
How to use the serp snippet preview tool
- 1
Enter your title and description
Type or paste the exact title and description you plan to publish, along with the page URL.
- 2
Check the pixel width readout
Watch the pixel counter beside each field. It shows the measured width against the real truncation limit, not a character guess.
- 3
Compare desktop and mobile
Switch between the desktop and mobile preview, since the truncation point differs and both are worth checking separately.
- 4
Adjust until the cut point is acceptable
Trim or reorder the text so the part that survives truncation, on both layouts, is the part that matters most.
Related tools worth bookmarking
Sources and further reading
- Google Search Central: Influence your title linksGoogle's own explanation of how title links are chosen and rewritten, including why the displayed title can differ from the tag.developers.google.com
- MDN: CanvasRenderingContext2D.measureTextThe browser API used to measure the real rendered pixel width of the title and description in this preview.developer.mozilla.org
- Schema.org: Getting started with structured dataBackground on how structured data can add extra elements, such as star ratings, on top of the plain title and description.schema.org
Frequently asked questions
Common questions about the serp snippet preview tool.
There is no fixed character count, because Google truncates by pixel width, roughly 580 pixels on desktop, not by a character total. A title built from narrow letters can run past 60 characters and still fit, while a title built from wide capital letters can clip well before 50. Measuring pixel width directly, as this tool does, is the only reliable way to know.
Google sometimes rewrites the displayed title when it judges an alternative, drawn from the page's headings or content, better matches the searcher's query, or when the original title is stuffed with keywords or unrelated boilerplate text. This is documented, expected behaviour rather than a bug, and it happens on a meaningful share of search results across the web.
No. Mobile search results use a genuinely narrower container, so the same title and description clip at an earlier point than they do on desktop, not merely appear smaller. Checking both layouts separately, as this tool lets you do, catches text that looks fine on desktop but is already cut off on the mobile results most searches actually happen on.
No. The pixel measurement is done locally using the browser's own canvas rendering API, and nothing you type is transmitted or stored. That makes it safe to preview a title and description for a page that has not been published yet.
The breadcrumb is built from your URL's path segments, split on slashes, and Google sometimes shortens a long path to just the domain and an ellipsis when there is not enough room to show every segment. This preview follows the same rule, so a URL with several nested folders may show a shortened breadcrumb, particularly on mobile.
It matches Google's documented render widths and truncation behaviour closely, using the same measurement technique a browser uses internally, but it cannot predict a title or description rewrite Google may apply for a specific query. Treat it as an accurate preview of your input, not a guarantee of the final rendered result for every possible search.