Languages

Google SERP Simulator

Free, no signup. Write a title and description and model truncation as you type — pixel-based, for desktop and mobile, with simulated query matches included in the width. The configured limits are controlled-font estimates, not measurements of a live Google result. ← Back to all tools

Built by Patrick Stox

Compare against other results

Paste up to 10 competing titles, one per line, then place your result among them.

Example data — replace with your own

Title · desktop
Title · mobile*
Description · desktop*
Description · mobile*
Desktop preview
Mobile preview*

* All limits are configured guidance pending live-SERP calibration. Mobile titles and both descriptions are especially approximate because wrapping and snippet choice vary by query. Query bold uses a synthesized 700 weight until matching bold font files are added.

What this result means ↓

Runs entirely in your browser — nothing you paste is uploaded or stored. Share links encode your inputs in the URL fragment locally. The preview uses a local letter avatar and makes no favicon request. Anonymous run-level outcome counters may be used for aggregate research; URLs, domains, IPs, and identifiers are never included, and no statistic is released below 100 runs.

Sample report Example data

Say you paste in this title, description, URL, and keyword list:

Title:  Google SERP Simulator — Preview Your Title & Meta Description
Desc:   Write a title tag and meta description and model how they may truncate on desktop and mobile, with simulated keyword bolding.
URL:    https://patrickstox.com/tools/serp-simulator/
Keywords: serp simulator, meta description

…and the desktop preview renders like this:

The title runs past the desktop pixel limit, so it's clipped with an ellipsis — and notice the query words SERP, Simulator, meta, and description are bolded, which pushes the width up further. The desktop title meter would show amber-into-red here; trimming the trailing brand phrase pulls it back under the limit and clears the truncation.

How to use it

  1. Type your Page title and Meta description. The pixel meters and both previews update live as you type; the character count sits next to each label.
  2. Add the URL so the preview shows the entered domain, favicon, and breadcrumb line.
  3. Enter your target Search keywords (comma-separated). Matching words are shown with simulated bolding — and the measured bold weight counts against the pixel limit.
  4. Optionally tick Show date before description to reserve the space Google's date prefix takes on time-sensitive results.
  5. Use Show rating, Dark SERP, or the clearly labeled AI Overview mock to compare common result treatments. Paste competing titles under Compare against other results to judge how your wording stands out in context.
  6. Watch the four meters (title and description, desktop and mobile). Amber means the text is near a configured preview width; red means it exceeds that product setting, not that Google is guaranteed to truncate it. Then Copy <title> tag, Copy meta tag, or Copy shareable link.

The simulator previews your title tagThe title tag is the HTML title element in a page's head that specifies the document's title. It's the primary source for the SERP title link and a confirmed light ranking factor — but since August 2021 Google doesn't always show it verbatim. and meta descriptionThe meta description is an HTML head tag — `<meta name="description" content="…">` — that suggests a short summary of the page for the search snippet. It's not a Google ranking factor, and Google rewrites it the majority of the time, but a good one can still lift click-through. the way they appear in Google search — styled after a standard result, with controlled-font truncation guidance. Already have a page live? Pair it with the SERP Snippet & Truncation Checker to pull the current title and description straight from a URL.

What the simulation shows

Each field gets a pixel reading (current / max px) and a coloured meter:

  • Green — comfortably under the limit. On desktop that's up to about 480 px for the title and 820 px for the description.
  • Amber — in the warning band: past the "safe" mark but not yet cut off (title 480–580 px desktop). Fine, but you're close to the edge.
  • Red — over the configured maximum (title > 580 px, description > 920 px on desktop), so truncation risk is high. The preview shows where this model places the ellipsis.

The tick mark on each bar is the warning threshold; the end of the bar is the truncation point. Because the model works in pixels, two titles with the same character count can land in different colours depending on how wide their letters — and their bolded query words — are.

How it works

Everything runs client-side — there's no server call. The tool renders your exact text onto an off-screen HTML canvas using self-hosted, metric-compatible fonts (Arimo at 20 px for the desktop title, Roboto at 16 px for mobile, and matching description fonts) and measures the resulting pixel width. That width is compared against configured per-field limits, and the truncation point is found by measuring where an ellipsis would fall.

Keyword bolding is part of the measurement, not just the display: matching words are rendered in the synthesized bold weight before measuring, so the preview's meter and clipped text stay internally consistent. The tool waits for document.fonts.ready before measuring; matching 700-weight font files and a live-SERP calibration pass remain launch blockers.

Features

  • Live desktop and mobile previews with self-hosted metric-compatible fonts, familiar result colours, a favicon, and URL breadcrumb line.
  • Four pixel meters — title and description, desktop and mobile — with green/amber/red status and a warning tick.
  • Simulated query-match bolding included in the width measurement, with the current synthesized-weight limitation disclosed.
  • Optional date and review-rating treatments for richer standard-result previews.
  • Dark SERP mode and an honestly labeled AI Overview mock for comparing different result contexts.
  • Paste up to ten competing titles and choose your position to see whether your result stands out.
  • One-click copy of a ready-to-paste <title> tag or <meta name="description"> tag.
  • Shareable link that preserves content, context, and display toggles in the URL fragment.
  • 100% client-side — nothing typed is uploaded or stored.

Limits of the simulation

This is a controlled preview, not a Google rendering guarantee. Mobile titles wrap to about two lines, and description limits vary because Google's snippet choice is query-dependent and frequently rewritten. The tool also can't predict whether Google shows your written description at all — it often generates its own from the page. There's no fetch-by-URL import here (that needs a server endpoint and is deferred); type or paste your text, or use the SERP Snippet & Truncation Checker to read a live page. The AI Overview block is only a layout mock, not a generated answer or appearance prediction, and the tool does not model features such as sitelinks or FAQ accordions.

Frequently asked questions

How long should a title tag be for Google?

Google title layouts are constrained by rendered width, not a universal character count. This tool measures your text in self-hosted, metric-compatible fonts against a configured desktop budget of roughly 580 pixels. Staying below the warning band reduces truncation risk, but the value is an estimate and not a guarantee.

How long should a meta description be?

The configured description budgets are around 920 pixels on desktop and roughly 600 to 680 on mobile — commonly 150 to 160 characters, but the visible length varies with the letters and the query. Treat those values as guidance. Keep the most important information near the front, because Google frequently rewrites or shortens descriptions and may pull its own snippet from the page.

Why does the simulator count pixels instead of characters?

A title full of narrow letters like "i" and "l" fits more characters than one full of wide letters like "m" and "W". Canvas measurements in self-hosted Arimo and Roboto capture that difference better than a character count. They are controlled-font estimates, not measurements taken from a live Google result.

Why does bolding my keywords make the title longer?

Search results can emphasize words that match the query, and bold text may use different spacing. Enter target keywords to simulate those matches and include their measured weight in the meter. The preview currently synthesizes the bold face from the self-hosted 400-weight fonts, so treat the exact bold-width delta as directional until matching 700-weight files are added and calibrated.

Does the AI Overview mock predict what Google will show?

No. It is a static, illustrative block for judging how an AI Overview could change the amount of space above your result. It does not generate an answer, predict whether Google will show an AI Overview, or reproduce the sources Google might cite. Real answers vary by query and can change after this preview is created.

Is my title and description sent to a server?

No. The simulator runs entirely in your browser. Nothing you type is uploaded or stored. The optional "Copy shareable link" button encodes your inputs into the URL fragment so you can share a preview, but that link is generated locally and never leaves your machine unless you send it.

Local data

Saved targets, named lists, and recent check summaries remain only in this browser.

Feedback
Report a bug

Found something broken in Serp Simulator? Let us know what happened — this goes straight to a private triage queue, not a public list.

What will be sent 
 No tool inputs, uploads, pasted source, complete results, query parameters, or URL fragments are attached automatically. You can edit or remove the selected passage above. Browser and anti-abuse metadata is processed for spam prevention. 
  
 
  
 
 
  
 
 
     
Next stepSERP Snippet & Truncation Checker — verify it with a direct check.

People also explore
ToolMeta Description GeneratorToolMeta Title GeneratorToolFavicon CheckerArticleTitle TagArticleMeta Tags for SEOArticleMeta Description
 
 
 
Feature requests for Serp Simulator
 

Upvote what you want most. New ideas can be submitted from the floating Feedback menu;
      requests appear here once approved, and the most-wanted rise to the top.

   
Loading…
  
  ➕ Request a feature   
New requests are reviewed before they appear here.
 
     
  
  
 
 
 
 
   
   
 
Where this tool helps
Common use cases
Draft a search snippet before publishing a page
Model a proposed title, description, URL, and target query before the metadata reaches a template or content-management system.
Compare desktop and mobile truncation risk
Use controlled-font pixel measurements and warning bands to see where the same wording may fit differently across result layouts.
Account for query matches and richer treatments
Simulate keyword bolding, a date prefix, review rating, dark mode, or an illustrative AI Overview block without presenting them as a Google prediction.
Judge a title against competing results
Place the draft among up to ten comparison titles and review how distinct the wording is from its closest neighbor.
Hand off or share the finished draft
Copy ready-to-paste title and meta tags, export the desktop preview as an image, or encode the current settings in a local shareable URL.
Watch the full workflow
Google SERP Simulator walkthrough
Read the transcript

      
      

        
Google SERP Simulator

        

        
If you are writing a page title and description but cannot tell how they may look in Google, the Google SERP Simulator gives you a useful draft view. I will load an example, fix a title that is too wide, compare desktop and mobile, and show the sharing and export tools.

      

      

        
Step 1

        

        
SERP means search engine results page. This tool lets you preview a proposed Google result before publishing it. You enter a title tag, which is the blue result heading, a meta description, which is the text below it, a URL, and target search words. Everything stays in your browser.

      

      

        
Step 2

        

        
Use it when drafting a new page, shortening a title that may be cut off, comparing desktop and mobile layouts, or showing a proposed result to a client or teammate. You can also compare nearby titles, copy the finished HTML tags, save an image, or share the completed setup.

      

      

        
Step 3

        

        
Here is the main work area. Your text fields are on the left, and four width meters are on the right. The title and description each have a desktop meter and a mobile meter. The two previews below update automatically whenever you change an input.

      

      

        
Step 4

        

        
To learn the layout, click the button labeled "Try an example." It fills every main field with sample text, turns on a review rating, and adds comparison titles. The gold "Example data" notice makes it clear that these values are only a demonstration and should be replaced with your own.

      

      

        
Step 5

        

        
The meters measure width in pixels, which are the tiny screen units used to draw each letter. Green means the text fits this model. Amber means it is close to the limit. Red means the preview will cut it off. The small tick marks the warning point. These colors show risk, not a guaranteed Google result.

      

      

        
Step 6

        

        
Desktop and mobile previews appear together, so you can see how the same wording fits each layout. The URL becomes the site name and path. Search words that match the title or description appear in bold, and that extra bold width is included in the meters.

      

      

        
Step 7

        

        
Now I will replace the sample title with a shorter version. Watch the desktop title meter move from amber to green and the full heading appear in both previews. This is why width is more useful than one fixed character limit: different letters take up different amounts of space.

      

      

        
Step 8

        

        
The search-keyword field shows which words may be emphasized for a query. Here, matching phrases are bold. Turning on "Show date before description" adds a date to the preview and reserves room for it in the description meter, so the warning changes with the visible layout.

      

      

        
Step 9

        

        
Open "Compare against other results" to paste as many as ten other titles, one per line. Changing "Your result position" moves your preview between them. The percentage tells you how different your title is from its closest neighbor. These are examples you provide, not live Google rankings or a ranking forecast.

      

      

        
Step 10

        

        
Optional controls let you show a review rating, switch the preview to a dark result theme, or add an AI Overview layout block. The block is labeled "Illustrative mock." It only helps you compare page spacing; it does not create an answer or predict whether Google will show an AI Overview.

      

      

        
Step 11

        

        
When the draft is ready, the handoff buttons do the repetitive work. "Copy title tag" puts the complete HTML title tag on your clipboard. "Copy meta tag" does the same for the description. "Export desktop image" downloads a picture of the desktop preview, and the status line confirms whether each action worked.

      

      

        
Step 12

        

        
The button labeled "Copy shareable link" saves the title, description, comparison text, and display choices in the part of the URL after the number sign. Opening that link recreates the same draft without sending it to a server. Only share it with people who should see the text you entered.

      

      

        
Step 13

        

        
The "How it works" section explains the measurement. The browser draws your exact words in locally stored fonts and measures their width. It also measures bold search terms and finds where an ellipsis would appear. This is more realistic than counting characters alone, but it still needs occasional comparison with real Google results.

      

      

        
Step 14

        

        
The "Limits of the simulation" section is important. Google may rewrite the title, choose different page text for the description, wrap mobile results differently, or add features this preview does not include. This tool also does not fetch a live URL. Use the SERP Snippet Checker for a published page, and always verify the real result separately.

      

      

        
Draft the snippet, compare it, then verify the live result

        

        
Use the simulator to improve your draft and share it with other people. After publishing, check the title and description on the page, then review the real search result separately. Google can rewrite both, so this preview is guidance, not a promise.

      

    
 
         
 
Common issues & how to fix them
 
     
  •  Error Title is empty Fix: Add a descriptive page title that states the primary topic before evaluating its search-result preview. 
  •  Warning Title exceeds the desktop width target Fix: Shorten the title until its measured desktop width fits the preview target while retaining the primary topic. 
  •  Warning Title exceeds the mobile width target Fix: Shorten the title until its measured mobile width fits the preview target, front-loading the most useful wording. 
  •  Error Description is empty Fix: Add a useful meta description that summarizes the page and gives searchers a reason to click. 
  •  Warning Description exceeds the preview target Fix: Trim the description to the preview target while preserving the page benefit and primary topic. 
    •