SERP Preview Tool

Preview how your page will look in Google search results with live character and pixel counters.

Desktop Preview
https://example.com
Your Page Title
Your meta description will appear here. Aim for 120–155 characters for best display.
Title 0 chars
Description 0 chars

📐 How to Use

  1. Enter your page title — aim for under 60 characters / 580px.
  2. Enter your page URL as it will appear in search results.
  3. Write your meta description — aim for under 155 characters.
  4. The preview updates live. Green = within limits, amber = approaching limit, red = likely truncated.

🎯 When to Use This

  • Trimming a title that reads well in the CMS but loses its brand suffix in search, where seeing the cut point matters more than the count.
  • Comparing two description drafts in separate tabs before choosing which one goes on a high-traffic product page.
  • Showing a client why their 90-character title cannot appear in full, using the truncated rendering rather than an argument about limits.
  • Drafting titles for a batch of new pages where every one has to fit the same template and still stay inside the width.

❓ Frequently Asked Questions

QWhat is the ideal title length?
Google truncates titles at roughly 580–600 pixels wide (about 50–60 characters). Titles beyond this show an ellipsis in search results.
QWhat is the ideal meta description length?
Google typically shows up to 155–160 characters on desktop and ~120 on mobile. Longer descriptions are cut off with "…".
QDoes Google always use my meta description?
Not always — Google may rewrite the snippet based on the query and page content. A well-written description increases the chance it's used as-is.

ℹ️ About This Tool

A Google result listing is assembled by Google, not served by your page. The link text usually comes from the title element, the snippet often from the meta description, and both are cut to fit the width of the result column rather than to a character count, which is why a title full of capital W's disappears sooner than one full of i's.

This preview measures your text the same way, with the canvas measureText API: the title is truncated at 580 pixels in 20px Arial and the description at 920 pixels in 14px Arial, with an ellipsis appended. Separate counters grade the raw character counts, green up to 60 for the title and 155 for the description, amber to 70 and 180, red beyond that. The URL is shown exactly as you type it.

⚠️ Notes & Limits

  • The preview is desktop-width only. Mobile results use a narrower column and a different font stack, and this tool does not model them.
  • Measurement uses Arial at 20px and 14px through the canvas API. Google serves a different font, so the widths here are close but not identical.
  • The character counters and the pixel truncation are separate checks and can disagree: a 58-character title of wide letters still gets an ellipsis.
  • The display URL is rendered verbatim. Google usually shows a site name and a breadcrumb trail derived from the path, which this preview does not reproduce.