SEO

Meta tags & SERP preview

See exactly how your page appears in Google, Facebook and Twitter. Live character counts and one-click HTML export.

Your meta <title> and <meta description>, plus your Open Graph and Twitter Card tags, are what people see before they decide to click — on Google search results, on LinkedIn shares, on WhatsApp previews, on Slack unfurls, on Facebook and Twitter. Get them wrong and your click-through rate drops 30-50% even if your page itself is excellent.

This tool renders a live preview in four surfaces (Google desktop, Google mobile, Facebook, Twitter/X), tracks length against the pixel-width budgets Google actually enforces (~60 chars for title, ~155 for description), and outputs a ready-to-paste block of <meta> tags covering SEO + Open Graph + Twitter.

0/60 (max 65)
0/155 (max 160)
app.kiwi
https://app.kiwi

Your page title shows here

Your meta description shows here — aim for 150-160 characters to avoid truncation in search results.

<link rel="canonical" href="https://app.kiwi" />

<!-- Open Graph -->
<meta property="og:url" content="https://app.kiwi" />
<meta property="og:type" content="website" />

<!-- Twitter -->
<meta name="twitter:card" content="summary" />

How it works

  1. 1Fill in your URL, title, meta description and social preview image.
  2. 2Watch the live character counts — green means in-range, amber is close to truncation, red is over.
  3. 3Flip between Google desktop, Google mobile, Facebook and Twitter previews to catch rendering issues.
  4. 4Copy the generated <meta> tags and paste them into your page <head>. Image should be 1200×630 for best cross-platform rendering.

Who it's for

  • •SEO specialists optimizing title + description for better organic CTR.
  • •Marketers launching a campaign landing page and wanting perfect social previews.
  • •Developers verifying OG tags before shipping — avoid the "image not showing" bug on LinkedIn.
  • •Content creators planning the headline before writing the post.
  • •E-commerce managers tuning product pages for Google Shopping + social shares.
  • •Freelance web designers handing over a polished, SEO-ready site to a client.

Pro tips

  • Put the most important keyword in the first 30 characters of the title — Google sometimes truncates and mobile users scan left-to-right.
  • Include the target keyword once, naturally, in the meta description. Stuffing keywords hurts CTR; readable sentences win.
  • End the description with an action word or CTA: "discover", "see how", "try free". Measurable +10-15% CTR lift on average.
  • Use a custom 1200×630 image for Open Graph. Screenshots look amateurish; a branded, text-on-image card dramatically increases shareability.
  • Keep og:title and meta title different if needed — the social version can be catchier since it doesn't fight for SEO keywords.
  • Always test with Facebook's sharing debugger and LinkedIn's Post Inspector after deploying. Cache invalidation matters.

Frequently asked questions

What's the ideal title length?+

Google's SERP title slot is roughly 580 pixels wide on desktop — about 60 characters in most fonts. Go over 65 and expect truncation ("…"). Mobile is slightly narrower (~50 chars). Aim for 50-60 characters to be safe on both.

Does meta description affect rankings?+

Not directly — Google has officially confirmed meta description isn't a ranking signal. But it heavily influences CTR, and CTR influences rankings indirectly. A page in position 4 with a 10% CTR will often out-rank a position 3 page with a 3% CTR over time.

What image size should I use for Open Graph?+

1200×630 pixels is the cross-platform safe bet — it renders correctly on Facebook, LinkedIn, Slack, Discord, WhatsApp and Twitter (with summary_large_image card). Keep text readable at small sizes because LinkedIn and messaging apps shrink it significantly.

Why does my Facebook preview show an old image?+

Facebook aggressively caches OG tags for up to 30 days. After updating your image, run your URL through Facebook's Sharing Debugger (developers.facebook.com/tools/debug) and click "Scrape Again" — that force-refreshes the cache instantly.

Do I need both Open Graph and Twitter tags?+

Technically Twitter will fall back to og:title / og:description / og:image if twitter: tags are missing — so you can get away with only OG. But specific twitter:card and twitter:image let you use a larger card format and override for Twitter-specific copy. Best practice: set both.

Related tools

UTM link builder

Build trackable campaign URLs with source, medium, campaign, term and content parameters. Auto-validates.

Word & character counter

Real-time word, character, sentence and paragraph counter. Reading time estimate for articles and posts.

QR code generator

Generate a high-resolution QR code for a URL, email, phone number or plain text. Download as PNG or SVG.

See all tools

Need more than this tool?

Kiwi combines CRM, invoicing, campaigns, AI agents and creative tools in one dashboard. 30 free credits, no credit card required.

Try Kiwi free Open the Kiwi SEO dashboard