Skip to content

SEO & Web

Twitter/X Card Preview

See how a link will render as a card on X, Facebook, and LinkedIn before you publish — based on your OG and Twitter meta tags.

X / Twitter (large)

example.com

Example article title for social sharing

A short description that fits neatly on a social card without being truncated.

Facebook / LinkedIn

example.com

Example article title for social sharing

A short description that fits neatly on a social card without being truncated.

Summary card (small)

Example article title for social sharing

A short description that fits neatly on a social card without being truncated.

Previews render from the values you enter — the image areas are placeholders. Test real cards with each platform’s inspector.

X Reads Its Own Tags — With a Fallback

X prefers twitter:card, twitter:title and twitter:image but falls back to the Open Graph equivalents when they are absent — which is why a page with only og: tags still renders cards. The summary_large_image card (the default choice for articles) shows the image edge-to-edge; summary shows a small square. Cards cache per-URL: after changing tags, the Card Validator re-fetches, otherwise the previous render persists. The image that matters most is the one at 1200×628 — X crops card images to that ratio.

How the Generator Works

  1. Paste your page URL, or fill in the title, description, and image fields manually to simulate tags that are not yet live.
  2. The preview renders three card variants: X large summary, Facebook/OG, and LinkedIn style.
  3. Check the image aspect guidance: 1200×630 renders cleanly on all three platforms.
  4. Adjust the values until all three previews look right, then copy the tag set.
Formula & Technical Standard
Cards render from og:title / og:description / og:image, overridden by twitter:* tags when present.

Example Output

Check a campaign landing page
Input: Draft OG tags for a product launch
Output: Three platform previews side by side
Catching a missing image or truncated title before sharing avoids a broken first impression.

Common Questions

Does this fetch the live page?

No. It renders previews from the values you enter, which also lets you test tags before the page is deployed.

Why do platforms cache cards?

To keep sharing fast. After changing tags, use each platform’s inspector/debugger tool to force a cache refresh.