SERP Snippet Preview

See how your title, URL and meta description look in Google on desktop and mobile, with pixel-accurate truncation.

Runs in your browser

Snippet

Title0 chars (aim 30–60) · 0 / 580 px

Shown as a breadcrumb: example.com › blog › post

Description0 chars (aim 120–158) · 0 / 920 px

Comma-separated. Google bolds words that match the search query.

Google shows a date for articles and news. It uses space in the description line.

Google preview

Device
Result theme
example.comhttps://example.com
Your page title appears here

No meta description — Google will build a snippet from the page content.

Widths are measured in pixels with Arial metrics (20px titles, 14px descriptions). Google may still rewrite or shorten snippets for a specific query.

Truncation details

Title · desktop0 chars (aim 30–60) · 0 / 580 px
Description · desktop0 chars (aim 120–158) · 0 / 920 px
Title · mobile0 chars (aim 30–60) · 0 / 650 px
Description · mobile0 chars (aim 120–158) · 0 / 680 px

What is a SERP snippet preview?

A SERP snippet is the block Google shows for each organic result: the site name and favicon, a breadcrumb-style URL, the blue title link and a short description. The title usually comes from your <title> tag and the description often comes from your meta description, so a preview lets you check how they will read before you publish.

Google does not cut snippets at a fixed number of characters. The limit is the pixel width of the text: on desktop, titles are shown at roughly 20px Arial and get cut at about 580–600px; descriptions at 14px are cut at around 920px on desktop and about 680px on mobile. A title full of wide letters like “W” and “M” is cut much earlier than one with narrow letters like “i” and “l”. This tool measures every character with Arial metrics and shows exactly where the “…” would appear.

Treat the result as a close approximation, not a guarantee. Google rewrites a large share of titles and descriptions to match the query, and layout details change over time. A snippet that fits, reads well and matches the page content is the best way to keep the version you wrote.

How to use the SERP Snippet Preview

  1. Enter your title tag, the page URL and the meta description — or click Sample to see an example.
  2. Add the keywords people search for. Matching words are bolded in the description, the way Google highlights query terms.
  3. Switch between Desktop and Mobile, and between light and dark result themes, to check every version.
  4. Use the pixel bars and the struck-through text under Truncation details to see what would be hidden, then tighten the copy until it fits.

Example

This 75-character title is about 721px wide at 20px Arial — well over the ~580px desktop limit — so the preview cuts it after “Step-by-Step”:

Title:  How to Make Cold Brew Coffee at Home: Easy Step-by-Step Guide for Beginners
Shown:  How to Make Cold Brew Coffee at Home: Easy Step-by-Step …

Tips for snippets that earn the click

  • Put the most important words first — they survive truncation and are what searchers scan for.
  • Keep titles unique per page and close to the page’s H1; Google is more likely to rewrite titles that are vague, stuffed or out of sync with the page.
  • Write descriptions as a promise of what the page delivers, not a list of keywords. Aim for roughly 120–158 characters, but judge by the pixel bar.
  • Dates appear for articles and news and take space from the description line. Keep datePublished/dateModified in your structured data honest.
  • Generate options with the Meta Title Generator and Meta Description Generator, then output the final tags with the Meta Tag Generator.

Frequently Asked Questions

How long should a title tag be?

There is no official limit. On desktop, Google cuts titles at about 580–600px, which is usually 50–60 characters. Longer titles are not penalised — the extra words are simply hidden and still help Google understand the page — but the visible part should make sense on its own.

How long should a meta description be?

Google truncates descriptions at roughly 920px on desktop and about 680px on mobile, which is around 150–160 and 110–120 characters respectively. Front-load the key message so the mobile version still works.

Why does Google show a different title or description than mine?

Google rewrites titles and descriptions when it thinks another text from the page better matches the query — common causes are boilerplate titles, keyword stuffing, titles that don’t match the H1 and missing or generic descriptions. You cannot force your version, but accurate, specific copy is rewritten less often.

Is the preview exactly what Google will show?

It is a close approximation. Widths are calculated from Arial font metrics, which match how Google sizes snippets, but the exact cut-off varies slightly by query, device, rich result features and layout experiments.

What controls the site name and breadcrumb?

Google picks the site name from the homepage, preferring WebSite structured data and consistent branding. The breadcrumb comes from the URL path or BreadcrumbList markup, which you can create with the Schema Markup Generator.