Developer SEO

X / Twitter card preview

Drop an image to see it here

example.com

Your card title

The twitter:description, or og:description if you have not set one.

Title 15 / 70 characters Description 67 / 200 characters Site or brand name Drop an image Optional. Nothing is uploaded.

Rendered in your browser · nothing is uploaded

Local · X falls back to Open Graph tags

Renders the summary_large_image card X builds from your twitter: or Open Graph tags. Titles are cut around 70 characters and the description often disappears entirely on mobile.

How to use the x / twitter card preview

1 Type your title and description. The preview updates as you type.

2 Watch the character counts — they turn red past the limit, and the preview shows where the cut lands.

3 Drop an image in to see the whole card.

X changed this more than once and the current behaviour surprises people: on many surfaces it shows the image and the domain with the title overlaid, and drops the description altogether. That makes the image do almost all the work, and it makes a card with no image very weak — it collapses to a bare link. If you set nothing X-specific, X falls back to your Open Graph tags, which is usually fine and one less thing to maintain. Set twitter:card to summary_large_image explicitly, since the default small card is considerably less prominent in the timeline.

Questions

Do I need twitter: tags? −

Not usually. X falls back to Open Graph tags, though setting twitter:card to summary_large_image is worth doing explicitly.

Why is my description not showing? +

What image size should I use? +

Is the truncation exact? +

What is the difference between summary and summary_large_image? +

Sources

The Open Graph protocol

Was this tool any good?

INTERNAL SIGNAL ONLY · WE USE IT TO FIND TOOLS WORTH REBUILDING