Twitter Card Types: Summary, Large Image, Player, and App Cards
Twitter Cards control how your links appear on X (formerly Twitter). There are four card types, each with different layouts, image sizes, and tag requirements.
The Four Card Types
summary — A compact card with a small square thumbnail on the left and title/description on the right.
<meta name="twitter:card" content="summary" />
<meta name="twitter:title" content="API Reference Documentation" />
<meta name="twitter:description" content="Complete REST API reference with examples." />
<meta name="twitter:image" content="https://example.com/images/api-thumb.jpg" />summary_large_image — A large card with a prominent image above the title and description. The most common choice for blog posts, articles, and landing pages.
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="How to Build a REST API" />
<meta name="twitter:description" content="Step-by-step guide with Node.js and Express." />
<meta name="twitter:image" content="https://example.com/images/rest-api-og.jpg" />player — An inline media player for audio or video content. Displays a playable embed directly in the timeline.
<meta name="twitter:card" content="player" />
<meta name="twitter:title" content="Episode 42: API Design Patterns" />
<meta name="twitter:player" content="https://example.com/embed/episode-42" />
<meta name="twitter:player:width" content="480" />
<meta name="twitter:player:height" content="270" />
<meta name="twitter:image" content="https://example.com/images/ep42-thumb.jpg" />The twitter:player URL must serve an HTTPS iframe-compatible page. This card type requires approval (see Approval Requirements below).
app — Displays a mobile app install card with name, description, icon, and an install button. Links directly to the App Store or Google Play.
<meta name="twitter:card" content="app" />
<meta name="twitter:app:id:iphone" content="929750075" />
<meta name="twitter:app:id:ipad" content="929750075" />
<meta name="twitter:app:id:googleplay" content="com.example.app" />
<meta name="twitter:app:name:iphone" content="MyApp" />
<meta name="twitter:app:name:googleplay" content="MyApp" />When to Use Each Type
summary — Homepage, profile pages, documentation, any page where the image is secondary.
summary_large_image — Blog posts, articles, landing pages, product pages — anything where the image drives engagement.
player — Podcast episodes, video content, music tracks, interactive demos.
app — Mobile app promotion pages.
Use summary_large_image as your default unless you have a specific reason for another type. It consistently produces the highest engagement.
All Twitter Meta Tags
twitter:card — Required. No max length. No OG fallback (must be set explicitly).
twitter:title — Required. Max 70 characters. Falls back to og:title.
twitter:description — Recommended. Max 200 characters. Falls back to og:description.
twitter:image — Recommended. Falls back to <a href="https://previewog.com/og-image-guide/">og:image</a>.
twitter:image:alt — Recommended. Max 420 characters. Falls back to og:image:alt.
twitter:site — Optional. The @username of the website's Twitter account.
twitter:creator — Optional. The @username of the content author.
twitter:player — Player card only. URL to an HTTPS iframe-compatible player.
twitter:player:width — Player card only. Width of the player iframe in pixels.
twitter:player:height — Player card only. Height of the player iframe in pixels.
twitter:player:stream — Optional. Direct URL to the video/audio stream.
twitter:app:id:iphone, twitter:app:id:ipad, twitter:app:id:googleplay — App card only. The app store IDs.
twitter:app:name:iphone, twitter:app:name:ipad, twitter:app:name:googleplay — App card only. The app names.
twitter:app:url:iphone, twitter:app:url:ipad, twitter:app:url:googleplay — Optional. Custom deep link URLs.
twitter:site is the @username of the website's Twitter account. twitter:creator is the @username of the content author. Both are optional but recommended for attribution.
Common Mistake: name vs property
Twitter card tags use the name attribute, not property. This is the most common implementation error.
<!-- CORRECT -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Page Title" />
<!-- WRONG — will be ignored -->
<meta property="twitter:card" content="summary_large_image" />
<meta property="twitter:title" content="Page Title" />OG tags use property. Twitter tags use name. Mix them up and the crawler will not find your tags.
<!-- OG tags use property -->
<meta property="og:title" content="Page Title" />
<!-- Twitter tags use name -->
<meta name="twitter:title" content="Page Title" />OG Fallback Behavior
Twitter's crawler checks for Twitter-specific tags first. If not found, it falls back to OG equivalents:
twitter:title falls back to og:title. twitter:description falls back to og:description. twitter:image falls back to og:image. twitter:image:alt falls back to og:image:alt.
Critical exception: twitter:card has no OG fallback. If you omit it, no card is generated — even if all other OG tags are present. Always set twitter:card explicitly.
This means if you already have complete OG tags, you only need one additional tag for Twitter:
<!-- If you already have og:title, og:description, og:image -->
<meta name="twitter:card" content="summary_large_image" />However, Twitter truncates titles at 70 characters and descriptions at 200 characters, which differs from Facebook. If your OG values are longer, add explicit Twitter tags with shorter text.
Image Requirements Per Card Type
summary — Minimum 144 x 144 pixels, maximum 4096 x 4096 pixels, max file size 5 MB. Aspect ratio 1:1 (square). Formats: JPEG, PNG, GIF, WebP.
summary_large_image — Recommended 1200 x 628 pixels, minimum 300 x 157 pixels, max file size 5 MB. Aspect ratio 2:1 (close to 1.91:1). Formats: JPEG, PNG, GIF, WebP.
player — Thumbnail minimum 262 x 262 pixels. Player must be an HTTPS iframe. Max file size 5 MB for the thumbnail.
app — Uses the app icon from the App Store / Google Play automatically.
If you share the same 1200 x 630 image between Facebook and Twitter, it works well for both. The summary card will center-crop it to a square; summary_large_image will display the full width.
Twitter Crawler and Caching
The Twitter crawler identifies itself as Twitterbot/1.0. Key behaviors:
No JavaScript execution. Reads raw HTML only. Client-side rendered OG tags are invisible.
Cache duration: approximately 7 days.
Follows redirects: up to a reasonable chain length.
Respects robots.txt for the Twitterbot user agent.
SVG images are not supported. Use JPEG, PNG, or WebP.
To force a cache refresh, use the Card Validator (see below).
Card Validator
The Twitter Card Validator was at cards-dev.twitter.com/validator. As of 2022, it no longer shows a visual preview of your card. However, entering a URL and clicking "Preview card" still forces Twitter to re-crawl the URL, which clears the cache.
How to use it for cache clearing:
1. Go to cards-dev.x.com/validator.
2. Enter your URL.
3. Click "Preview card."
4. The visual preview is no longer rendered, but the re-crawl is triggered.
5. The "Log" section shows whether your tags were parsed successfully.
For verifying how your card actually looks, share the URL in a tweet (you can use a private/locked account) or use a third-party preview tool like PreviewOG.
Approval Requirements
Since 2018, summary and summary_large_image cards work automatically. No approval or whitelist is needed.
Player cards still require approval. You must apply through the Player Card approval process and have your domain whitelisted before player cards will render.
App cards do not require separate approval.
Minimal Code Example
For most websites, this is all you need alongside your existing OG tags:
<!-- Open Graph (used by Facebook, LinkedIn, etc.) -->
<meta property="og:title" content="How to Build a REST API with Node.js" />
<meta property="og:description" content="Production-ready REST API guide with Express and PostgreSQL." />
<meta property="og:image" content="https://example.com/images/rest-api-og.jpg" />
<meta property="og:url" content="https://example.com/blog/rest-api-guide/" />
<meta property="og:type" content="article" />
<!-- Twitter Card (only twitter:card is strictly required; rest falls back to OG) -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:site" content="@yoursite" />
<meta name="twitter:creator" content="@authorhandle" />If you want Twitter-specific values (shorter title, different image):
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Build a REST API — Quick Guide" />
<meta name="twitter:description" content="Node.js + Express + PostgreSQL. Full tutorial." />
<meta name="twitter:image" content="https://example.com/images/rest-api-twitter.jpg" />
<meta name="twitter:image:alt" content="REST API architecture diagram" />
<meta name="twitter:site" content="@yoursite" />Quick Reference
Card types: summary, summary_large_image, player, app.
Attribute: name (not property).
Title max length: 70 characters.
Description max length: 200 characters.
Image max file size: 5 MB.
summary image: 144x144 min, 1:1 ratio.
summary_large_image: 300x157 min, 1200x628 recommended, 2:1 ratio.
Crawler user agent: Twitterbot/1.0.
Cache duration: approximately 7 days.
JavaScript: Not executed.
Approval needed: Only for player cards.
OG fallback: All tags except twitter:card.
FAQ
You need at minimum twitter:card — it has no OG fallback. For twitter:title, twitter:description, and twitter:image, Twitter will fall back to the corresponding OG tags if the Twitter-specific tags are absent. So if you have complete OG tags, just adding <meta name="twitter:card" content="summary_large_image" /> is enough.
Common causes: (1) image is smaller than the minimum dimensions for the card type, (2) image URL returns a 404 or redirect chain, (3) image is SVG (not supported), (4) twitter:card is missing so no card is generated at all, (5) the page is blocked by robots.txt for Twitterbot. Check the Card Validator logs for specific error messages.
No. twitter:site and twitter:creator are optional. They add attribution to the card (showing which account published the content and who wrote it) but the card renders without them.
Not for summary or summary_large_image cards. These have been automatic since 2018. You only need approval for player cards (audio/video embeds). App cards also do not require separate approval.
The Card Validator at cards-dev.x.com/validator no longer shows a visual preview but still triggers a re-crawl and shows parsing logs. To see the actual card, share the link in a tweet from a private/locked account or use a third-party OG preview tool like PreviewOG.