Title Tag Generator
Generate a <title> tag with live character and pixel-width counters for SERP truncation.
Written by Golam Rabbani, Founder & Lead Engineer
How to use this title tag generator
- Enter the primary title text — the main keyword or headline.
- Optionally add a secondary phrase (USP or modifier) and your brand name.
- Pick a separator — pipe, hyphen, bullet, colon, or em dash.
- Pick the order — primary first or brand first.
- Watch the live character + pixel-width meters; both warn near the SERP truncation point.
- Press Generate to emit the wrapped <title> tag.
About this title tag generator
The title tag generator builds a <title> string from up to three parts joined by a separator and renders live counters for both character count (target ≤ 60) and pixel width (target ≤ 580px, the desktop-SERP budget Google uses to decide truncation). Pixel width is approximated from a per-character lookup table tuned for Arial 16px — the typeface Google currently uses — so wide letters like W and m cost more than narrow ones like i and l, and the meter reflects the real-world SERP fit better than a naive character count.
Worked example: primary = "Free SQL Formatter", secondary = "Pretty Print & Validate", brand = "Toolnest", separator = pipe, order = primary first. The preview shows 51 characters / around 380 pixels — both well within budget — and Generate emits: <title>Free SQL Formatter | Pretty Print & Validate | Toolnest</title>
Less-than and greater-than characters in the title are HTML-escaped inside the wrap so the tag is safe to drop straight into your <head>. Switch the order to "Brand first" and the same fields rearrange to "Toolnest | Free SQL Formatter | Pretty Print & Validate".
FAQ
- Why measure pixels in addition to characters?
- Google truncates titles by pixel width, not character count. A 55-character title made of wide letters (Ws, Ms, capitals) can overflow while a 65-character title of narrow letters fits. The pixel meter approximates that real cutoff.
- How accurate is the pixel measurement?
- It uses a per-character lookup table calibrated against Arial 16px — the typeface Google's SERPs use today. Real width depends on rendering and font fallback, so treat the number as a guide, not a guarantee. Stay below 580px to leave headroom.
- Which separator should I pick?
- Pipe (|) and hyphen (-) are the most common; bullet (•) and em dash (—) read slightly more distinctively. There is no SEO advantage to any particular separator — pick the one that fits your brand voice.
- Should the brand come first or last?
- Last is the default convention because it puts the keyword in the part of the SERP users scan first. Brand-first is reasonable for high-recognition brands where the name itself is the click magnet.
- Will the tool escape special characters?
- It HTML-escapes < and > so the resulting <title> tag is well-formed if you paste it straight into the head. Ampersands inside the title also need escaping when published — encode them as & manually if your CMS does not.
- Is anything sent to a server?
- No. Both generation and measurement happen entirely in your browser.