Glossary
Twitter Cards
X's own preview tags — and why most pages need only one of them.
By Roger Campos · Last updated: September 2026
TL;DR
Twitter Cards are meta tags, named twitter:card, twitter:title, twitter:description and twitter:image, that control how a link is previewed on X (formerly Twitter). twitter:card picks the layout — usually summary or summary_large_image — and X falls back to Open Graph tags for anything the twitter: tags leave out.
Free plan, no credit card. 1,000 credits a month.
How it works
Card types and tags
| twitter:card | Looks like | Image |
|---|---|---|
| summary | Small square thumbnail beside the title | 1:1, at least 144 × 144 px |
| summary_large_image | Full-width image above the title | 2:1, at least 300 × 157 px |
| player | Inline video or audio player | Needs approval from X |
| app | App store install card | From the app listing |
The tags use the name attribute. twitter:site and twitter:creator name the site's and the author's accounts.
In practice
The fallback that saves you work
When a twitter: tag is missing, X uses the Open Graph equivalent: og:title, og:description, og:image. So a page with a complete Open Graph set needs one extra line for a large-image card:
<meta property="og:title" content="How we cut our build time in half">
<meta property="og:description" content="Three changes, measured over a month of CI runs.">
<meta property="og:image" content="https://example.com/og/build-time.png">
<meta name="twitter:card" content="summary_large_image">Add separate twitter:title or twitter:image only when you want X to show something different — a shorter title, or an image cropped for 2:1. Like every preview fetcher, X's reads the HTML source, so the tags must be there without JavaScript.
To check a page the way X sees it, fetch the source with curl and look for twitter:card in the <head>: if it only appears in DevTools, JavaScript put it there and X will not see it. A card that looks wrong after you fix the tags is usually a cached one — X re-fetches a URL's card only after a while, so test with a URL it hasn't seen, such as one with a new query string.
FAQ
Frequently asked questions
Only twitter:card, to pick the layout. X falls back to og:title, og:description and og:image for the rest.
summary shows a small square thumbnail next to the text; summary_large_image shows a wide image above it. The large one takes a 2:1 image.
Check that the tags are in the HTML source rather than added by JavaScript, that the image URL is absolute and publicly downloadable, and that robots.txt doesn't block X's fetcher.
See it on your own pages.
Free plan, no card. Confirm your email and your API key is live — you'll be making real requests in minutes.