Twitter Card Generator
Choose a card type, enter title, description and image, see the card as it appears in a post on X, and copy the twitter: meta tags for the head of your page.
- 4 card types
- Light and dark preview
- Image size check
- Runs in your browser
Card
The @ is added for you.
Optional — the person who wrote the page.
A website preview cannot load pictures from other sites, so pick the file from your device. It is only shown here and measured — it never leaves your device.
Read aloud by screen readers. Up to 420 characters.
Used for the domain line of the preview and for og:url. X has no tag of its own for it.
Player
An https:// page that contains only the player and works inside an iframe.
Optional: direct address of the video or audio file (MP4 or AAC).
App
Two-letter code such as US or DE — only needed when the app is not in the US store.
Preview
The preview follows the current layout of X: large cards show the title on the picture and the domain below it, and the description is not shown. X caches a card for about a week after the first post.
Checklist
HTML code
X reads og:title, og:description and og:image when twitter:title, twitter:description and twitter:image are missing. With this on, those three are written once as Open Graph tags that Facebook, LinkedIn and WhatsApp use too. twitter:card has no fallback and always stays.
Import from existing HTML
The pasted code is only read as text inside your browser. Scripts in it never run, nothing is loaded from it and nothing is sent anywhere. Importing replaces what is in the form now.
How to create an X (Twitter) card
The code and the preview update while you type.
- 1
Pick the card type
Large image for articles and landing pages, summary for a small square picture, player for video or audio, app for a mobile app.
- 2
Fill in the card
Enter the X account of the site, title, description, image URL and alt text. Choose the image file from your device to preview and measure it.
- 3
Check and copy
Fix what the checklist flags, then paste the code into the <code><head></code> of your page.
Card tags that X actually reads
All four card types, with their own fields and checks.
Preview in both themes
Shows the card in light and dark mode. Large cards follow the current layout of X: the title sits on the picture, the domain below it.
Image check per card type
Measures the picture you choose from your device and warns when it is too small, larger than 4096 × 4096 px, heavier than 5 MB or will be cropped.
Player card
Fields for the player page, its width and height and an optional stream address, with a check that every address uses https.
App card
App name, ID and deep link for iPhone, iPad and Google Play, plus the country of the store. IDs are checked for the right format.
Open Graph fallback
One switch writes title, description and image as Open Graph tags that X reads too — shorter code that also serves other networks.
Import existing HTML
Paste the source of a page to load its current card tags into the form. The pasted code is only read as text.
Private by design
Everything runs in your browser. What you type, paste or open is not sent to a server.
Free, no sign-up
No account, no limits, no watermark — on a phone, tablet or computer.
How X (Twitter) cards work
A card is the preview X attaches to a post that contains a link. X fetches the page and reads the twitter: meta tags in its head. The key tag is twitter:card, which selects one of four types: summary, summary_large_image, player or app. The tags still carry the old name of the network; nothing changed in the markup when Twitter became X, so existing pages do not need to be updated.
X falls back to Open Graph. When twitter:title, twitter:description or twitter:image is missing, it uses og:title, og:description and og:image instead. A page that already has Open Graph tags therefore only needs twitter:card, which has no fallback, and ideally twitter:site with the account of the website. Note that card tags use the attribute name, while Open Graph tags use property. This tool can write either form: all twitter: tags, or the shorter Open Graph fallback.
Common mistakes: an image address that is relative or uses http; an SVG picture, which cards do not show; a wide picture on a summary card, which is cropped to a square; a title longer than 70 characters, which is cut off; and a missing alt text for the image. Player cards need an https page that works inside an iframe and must be approved by X before they appear. X also caches a card for about a week, so changes are not visible at once.
The four card types
| Card type | What it shows | Image |
|---|---|---|
| <code>summary_large_image</code> | A wide picture with the title on it — for articles and landing pages | About 2:1, 1200 × 628 px recommended, at least 300 × 157 px |
| <code>summary</code> | A small square picture next to title and description | Square, at least 144 × 144 px |
| <code>player</code> | Video or audio that plays inside the post | A preview picture, plus player width and height |
| <code>app</code> | A mobile app with name, description and a store link | Taken from the app store |
Tips
- Create the full set of share tags for Facebook, LinkedIn and messaging apps with the Open Graph Generator.
- Make a 1200 × 628 px card picture with the OG Image Generator, or crop an existing one with the Social Media Image Resizer.
- Tag the links you post so the visits show up in your analytics — the UTM Builder builds the campaign URL.
- To see the real card, paste the link into the post composer on X. If an old card appears, it is still in the cache from an earlier post.
Frequently asked questions
Can’t find your answer? Contact us — we reply quickly.
What size should a Twitter card image be?
For the large image card use about 2:1, ideally 1200 × 628 pixels and at least 300 × 157. The summary card shows a square of at least 144 × 144 pixels. Files must be under 5 MB and in JPG, PNG, WebP or GIF format.
Do I need Twitter card tags if I already have Open Graph tags?
Only one: twitter:card, to choose the card type. X takes title, description and image from the Open Graph tags when its own tags are missing. Adding twitter:site with your account is recommended.
Are Twitter cards still called Twitter cards on X?
The network is called X, but the meta tags keep the prefix twitter:. There is no new x: prefix, and existing tags continue to work.
Why is my card not showing on X?
Check that twitter:card is present, that the image address is a full https:// URL the X crawler can reach, and that robots.txt does not block it. A card posted earlier stays in the cache for about a week.
What is the difference between summary and summary_large_image?
The summary card shows a small square picture beside the title and description. The large image card shows a wide picture across the post with the title on it and the domain below; the description is not displayed.
Is my data sent to a server?
No. The tool runs entirely in your browser. Your input is not uploaded, logged or stored on our servers.
More free SEO and website tools
Generate tags and files, check status codes, redirects, DNS and certificates — free, without an account.