SERP Snippet Preview Generator

Write the snippet against the layout it has to live in, rather than guessing from a character count.

Preview

e
0Title pixels
0Description pixels
NoTruncated?

Runs in your browser. Everything you type or load here is processed locally by JavaScript on this page. Nothing is uploaded to Tooltrusty or to any third party.

What the sERP Snippet Preview Generator does

A search result is the advertisement for your page, and it is written by three fields you control — the title tag, the URL and the meta description — laid out in a box you do not. This previewer reconstructs that box so you can write the snippet against its real constraints.

The preview reproduces the current Google layout: the site name and breadcrumb-style URL on the first line, the clickable title in blue below it, and the description underneath. Truncation is calculated by measuring your text in the same fonts Google renders, so the ellipsis appears where it genuinely would rather than at an arbitrary character count.

Switching to mobile changes more than the width. The container narrows, the title font drops a couple of pixels, and the description budget shrinks by about a quarter. Since most search traffic is now mobile for the majority of sites, this is the view worth optimising, and a snippet that fits on desktop can still lose its ending on a phone.

The date option matters for anything time-sensitive. When Google shows a published date it takes that space out of your description budget, which is a common reason a carefully measured description still gets cut on a blog post or news article.

How to use it

  1. Enter the page URL, title tag and meta description.
  2. Switch between desktop and mobile — mobile is usually the stricter constraint and the larger share of traffic.
  3. Tick the date option if the page will show a published date, since that eats into the description.
  4. Edit until the Truncated? indicator reads No, and the first few words still make the case on their own.

A worked example

The same page, previewed on both devices:

DeviceTitle shown
Desktop (580px)Best Running Shoes for Flat Feet in 2026 | Stride Lab
Mobile (495px)Best Running Shoes for Flat Feet in 2026 |…

The desktop version fits; the mobile one loses the brand. That is an acceptable trade — the subject survives and the brand does not, which is the right way round. Reverse the title to Stride Lab | Best Running Shoes… and the mobile result becomes an unrecognisable brand name followed by an ellipsis, which nobody clicks.

Frequently asked questions

Will Google show exactly what I write here?

Not always. Google rewrites titles for roughly a third of results and descriptions for most of them, adapting the snippet to the specific query. What you write is a strong signal and the default, not a guarantee. Writing a clear, accurate title makes a rewrite less likely.

Why does my snippet look different in a real search?

Search results carry extra elements depending on the page — site links, star ratings, FAQ accordions, prices, dates. Those come from structured data and from Google's own judgement. This preview shows the base layout that everything else is built on.

Should I optimise for desktop or mobile?

Mobile, in most cases, since it carries the majority of search traffic for the majority of sites. The mobile constraint is tighter, so a snippet that works there works everywhere. Check your own analytics if your audience skews to desktop.

Does the URL shown affect click-through?

It contributes. Google displays a breadcrumb-style path rather than the raw URL, so a clean, readable slug reads better than a string of numbers. That is a good reason to keep slugs short and descriptive.