How to set up X (Twitter) cards
X reads its own card tags before falling back to Open Graph. summary_large_image with a wide image gets the most clicks.
Step by step, with screenshots: Twitter/X cards: summary vs summary_large_image and what X reads →
Check your own site
Runs these 2 checks and the other 191, free, in about 45 seconds.
Or run only this check with the free Open Graph & social tag generator or the free Meta tag checker.
What it is
Twitter cards, now X cards, are meta tags that control how a link looks when it is posted on X: twitter:card sets the layout, and twitter:title, twitter:description and twitter:image fill it in. The two main layouts are summary, with a small square thumbnail, and summary_large_image, with a wide image above the text.
X needs twitter:card to show a card at all. For the other fields it falls back to your Open Graph tags, so a page with og:title, og:description and og:image only needs one extra line. summary_large_image uses a 2:1 image and takes far more space in the timeline than a plain link.
OK looks like this: twitter:card set to summary_large_image or summary, and an image available through twitter:image or og:image. getReport checks both and renders the card as X would show it.
What a passing site looks like
- Twitter card type is validwarning · −3 ptseffort S
- X (Twitter) cards have an imagewarning · −1 ptseffort S
1. Twitter card type is missing or invalid
Why it matters. X (Twitter) shows a preview card only when twitter:card has a valid type. Without it a shared link is plain text, even with Open Graph tags in place.
- Add <meta name="twitter:card" content="summary_large_image"> to show the share image at full width.
- Use "summary" instead for a small square thumbnail beside the text.
2. No image for X (Twitter) cards
Why it matters. X uses twitter:image, or falls back to og:image. With neither, the card shows text only and gets far fewer clicks.
- Add <meta name="twitter:image" content="https://…/share.jpg">, or set og:image; X reads that as a fallback.
Questions people ask
Is there still a Twitter Card Validator?
The Card Validator page still exists, but X removed its preview in 2022, so it no longer shows how a card looks. To preview a card, paste the link into a new post draft on X, or use getReport's link preview, which renders the X card from your tags without posting anything.
What is a Twitter card?
A Twitter card is the rich preview X shows for a link: a title, description and image in a box, instead of a bare URL. It is controlled by twitter: meta tags in the page's head, with Open Graph tags as fallback. Without a valid twitter:card tag, X shows the link as plain text.
What size should a Twitter card image be?
For summary_large_image use a 2:1 image, such as 1200 × 600 px; X accepts images from 300 × 157 px up to 4096 × 4096 px and under 5 MB. For the summary card use a square image of at least 144 × 144 px. JPG, PNG, WebP and GIF work; keep text away from the edges.
What is the difference between summary and summary_large_image?
summary shows a small square thumbnail next to the title and description; summary_large_image shows a large, wide image above them. Large images take more space in the timeline and usually get more clicks, so use summary_large_image unless you only have a square logo to show.
Does X use Open Graph tags?
Yes, as a fallback. If twitter:title, twitter:description or twitter:image are missing, X reads og:title, og:description and og:image instead. It does need its own twitter:card tag to choose the layout, so add that one line even when your Open Graph tags are complete.