Paste HTML and preview how Facebook, Twitter, LinkedIn, and Slack will render your share card.
Your HTML is parsed in your browser. Nothing is sent to a server or fetched from a URL.
How to brew the perfect cup of green tea
A complete guide to brewing Japanese green tea, covering water temperature, steep time, and tea-to-water ratios.
| htmlTitle | How to brew the perfect cup of green tea |
| metaDescription | A complete guide to brewing Japanese green tea, covering water temperature, steep time, and tea-to-water ratios. |
| title | How to brew the perfect cup of green tea |
| description | A complete guide to brewing Japanese green tea, covering water temperature, steep time, and tea-to-water ratios. |
| image | https://example.com/og/green-tea.jpg |
| url | https://example.com/blog/green-tea-guide |
| type | article |
| siteName | Tea Journal |
| twitterCard | summary_large_image |
| twitterSite | @teajournal |
| canonical | https://example.com/blog/green-tea-guide |
Generate schema.org JSON-LD markup for Article, Product, FAQ, LocalBusiness, Person, Event, and Breadcrumbs. Form-based, copy-paste ready.
Build trackable URLs with utm_source / utm_medium / utm_campaign params. QR code generated automatically. GA4 / Universal Analytics compatible.
Validate sitemap.xml structure, lastmod format, hreflang alternates, and URL count limits — all in your browser.
Simulate how Googlebot and other crawlers apply Allow/Disallow rules from your robots.txt to specific URLs.
When you share a URL on Facebook, LinkedIn, Slack, Discord, or post a link on Twitter/X, the social platform reads the Open Graph (og:*) and Twitter Card (twitter:*) meta tags from your HTML <head> and renders a preview card with a title, description, and image. A missing og:image can reduce click-through rate by 5–10x, and a title that exceeds 70 characters gets visibly truncated. This Open Graph Preview tool lets you paste any HTML and see exactly how the four major platforms will render your card — without uploading anything to a server or fetching the URL remotely. The validator also flags missing required tags, oversized titles and descriptions, relative-path og:image URLs, and missing Twitter Card type. Use it during development before pushing meta changes, or after a deploy to verify your CMS, headless framework, or static site generator is emitting the metadata you expect.
Facebook, LinkedIn, and Slack all need the same four properties as a baseline: og:title (50–60 chars), og:description (150–200 chars), og:image (absolute https URL, ideally 1200×630), and og:url (canonical). For Twitter/X you additionally need twitter:card set to "summary_large_image" if you want the big preview rather than the small thumbnail. og:site_name, og:type, and twitter:site/twitter:creator are recommended but not strictly required.