SERP Snippet Previewer
Type a title tag, a meta description and a URL, and see the result Google would build from them on both desktop and mobile. The cut-off point is worked out from the width the text actually renders at, not from a character count, because that is what Google truncates on. The wrap you see and the over/under indicator beside it are the same measurement, so the preview cannot tell you one thing while the meter says another.
Your snippet
How it would look
Measuring. This needs a browser canvas to get the pixel widths, so the preview appears a moment after the page loads.
Design the page the snippet is selling
A snippet earns the click. Moda is where you build what the click lands on.
Try Moda free →Why character counts get this wrong
Almost every snippet tool counts characters and tells you to stay under 60 for a title and 155 for a description. Those numbers are averages of a measurement nobody is actually taking. Google lays results out in a fixed-width column and clips whatever overflows it, so what matters is how wide the string draws. "Illinois Immigration Attorney" and "MMMMMMMMM MMMMMMMMM MMMMMMMMM" are both 29 characters; the second is close to twice as wide and gets cut while the first has room to spare. Titles full of capitals, wide letters, em dashes and pipe separators run over their character budget in pixels long before they run over it in characters, and title case costs more than sentence case for the same words. This page asks the browser to draw the string and measures the result.
What the numbers under each preview mean
Each field reports the width its text draws at and the width the surface has: for a desktop title that is one line of about 600 pixels, for a desktop description two lines of the same width, and on mobile a narrower column that wraps to more lines. Green means it fits. Amber means it fits with room left, which is not an error but is a missed chance to say something more specific. Red means it was cut, and the preview above shows exactly where. The character count is still displayed beside the pixel figure, because a lot of CMS fields and briefs are still specified in characters and you may need to report the number someone else asked for.
Desktop and mobile truncate differently, and both matter
Mobile results use a narrower column but allow the title to wrap onto a second line, so a long title is often fully visible on a phone and clipped on a laptop. Descriptions go the other way: mobile shows more lines, so a description written to the desktop budget leaves visible blank space on the surface where most of your traffic actually is. Both surfaces are shown together for that reason. Front-load the part that earns the click into the first third of each field — the part every surface shows — and neither can hide it from you.
What Google does after you publish
The snippet you write is an input, not an output. Google rewrites titles it judges unhelpful, generally substituting an H1 or the site name, and it very often ignores the meta description entirely in favour of a passage lifted from the page that matches the query. Neither is a penalty and neither is fixable by tuning the length. What length control buys you is that when your version is used, it is used whole. Write the description so the first sentence stands alone, and a rewrite that keeps only part of it still says something.
Frequently asked questions
What pixel width does Google actually truncate at?
Nobody outside Google knows, and Google has never published it. The widths used here are measured against the layout Google currently serves: roughly a 600-pixel column on desktop with one title line and two description lines, and a narrower column on mobile that wraps to more. Those numbers move. Google runs layout experiments continuously, renders in a different font stack per platform, and shows different result shapes for the same query depending on what else is on the page. Treat the meter as a budget with a margin of error of a few percent, not as a line you can sit exactly on top of.
Which font is the measurement taken in?
Arial, at 20 pixels for a desktop title and 14 for the description, which is what Google resolves to on Windows and what its stack falls back to on most other machines. Your browser does the drawing, so the measurement uses the same font file the browser would use. That does mean a machine with an unusual Arial substitute can produce slightly different widths than a colleague sees, which is another reason to leave a little headroom rather than filling the bar exactly.
Is anything I type here sent to a server?
No. The page has no upload, no fetch and no analytics on the field contents. Measurement is a canvas call in your own tab, and the preview is drawn from what that call returns. You can put an unreleased product name or an unpublished page into it without it existing anywhere but your browser.
Why does the preview show the URL as a breadcrumb?
Because that is what Google shows. It replaced the raw URL line with a breadcrumb built from the domain and the path segments, so a deep URL reads as a trail rather than a string of slashes. It is worth looking at: a path segment full of dates, IDs or stop words is visible to searchers in a way it was not before the change, and shortening a slug is one of the cheapest snippet improvements available.
Does a longer description help rankings?
No. The meta description is not a ranking factor and has not been for many years. Its whole job is click-through rate on a result you already earned. That is why this page reports "room left over" rather than "too short": there is no bonus for filling the bar, only a cost to being cut mid-sentence, and a specific 110-character description will out-click a padded 155-character one most of the time.