Meta Tag Previewer
<meta property="og:title" content="Hand-checked browser tools" /> <meta property="og:description" content="Small, free tools that run entirely in your own browser: no installs, no sign-ups." /> <meta property="og:site_name" content="chekkutooru" /> <meta property="og:url" content="https://example.com/tools/nkro" /> <meta name="twitter:card" content="summary" />
Previews are neutral wireframes, not exact renderings; each platform applies its own crop and typography. Nothing you type leaves this page.
How it works
仕組みWhen a link is shared, platforms build the preview card from Open Graph and Twitter meta tags, so a missing og:title or description means an ugly, half-empty card. Fill in your page’s title, description, site name, URL, and optional image URL, and this tool renders three neutral wireframe previews (search-result, large-card, and compact-link styles) plus a ready-to-paste block of properly HTML-escaped meta tags. Everything stays in your browser: the image URL is shown as a placeholder rather than fetched, so nothing is requested from anywhere.
1200×630 pixels (a 1.91:1 ratio) is the safest all-round size for large cards, and platforms downscale it cleanly. Keep important content away from the edges, since some renderers crop toward the center, and keep the file under about 1 MB for fast fetching.
Each platform changes its card design regularly and applies its own fonts, crops, and truncation, so a pixel-faithful imitation would go stale fast. These wireframes show what information appears and roughly where, which is the part you actually control with your tags.
Platforms cache scraped metadata aggressively, sometimes for weeks. After changing tags, run the URL through the platform’s own debugger or sharing validator to force a re-scrape, and confirm your server returns the tags in the raw HTML; client-side rendered tags are often missed by scrapers.