What is the difference between summary and summary_large_image?

summary shows a small square thumbnail beside the title and description, suited to text-led links. summary_large_image shows a large full-width image above the title and description, ideal for visual content like articles, products, and videos. Most publishers use summary_large_image.

What image size and format should I use?

For summary_large_image, use a 2:1 ratio image at least 300x157 and up to 4096x4096 pixels, commonly 1200x600 or 1200x628. For summary, use a 1:1 square at least 144x144. Supported formats are JPG, PNG, WEBP, and GIF, with a file under 5 MB.

What are twitter:site and twitter:creator?

twitter:site is the @handle of the website or publisher, and twitter:creator is the @handle of the individual author. They attribute the card and can surface follow prompts. Both are optional but recommended when you have the handles.

Does X read Open Graph tags as a fallback?

Yes. If twitter: tags are missing, X falls back to Open Graph tags like og:title and og:image. Providing dedicated twitter: tags gives you precise control on X, which is why this builder emits them explicitly.

Why does my card not show after I add the tags?

X caches cards, so changes may not appear immediately. Ensure the image is publicly reachable over https, the page is not blocked by robots, and the tags are inside the head. New cards can take time to propagate as the crawler re-fetches the page.

What is the Twitter Card Meta Tag Builder?

Build all required Twitter Card meta tags — card type, site, creator, title, description, image, and image alt — with a live preview of how the card renders on X. Choose summary or summary_large_image. Outputs paste-ready HTML. It runs free in your browser on Gera Tools, with nothing uploaded.

Twitter Card Meta Tag Builder

Name: Twitter Card Meta Tag Builder
Creator: Gera Tools
License: https://creativecommons.org/licenses/by/4.0/

Get one useful tool a week

Like this tool? Enter your email and we'll send you one genuinely useful Gera tool a week — plus a link to come back to this one. No spam, one-click unsubscribe any time.

Control exactly how your links look on X

When a link is posted to X, the Twitter Card meta tags decide whether it appears as a flat URL or a polished card with an image, headline, and summary. This builder generates every tag X reads, lets you pick between the compact and large-image layouts, and shows a live preview so you can see the result before you ship.

The two card types and when to use each

summary — A small square thumbnail appears to the left of the title and description. Use this for text-heavy content where the image is secondary: news articles with generic header photos, blog posts, documentation pages, or any link where the headline and description communicate more than the visual.

summary_large_image — A large full-width image appears above the title and description, occupying significantly more feed space. Use this for anything visual: product pages, marketing announcements, photography, video thumbnails, or any content where the image itself communicates value. Most publishers default to this type because larger cards earn more clicks.

What each tag does

The tool emits the Twitter Card tags in the order the crawler expects:

twitter:card — tells X which card layout to use (summary or summary_large_image).
twitter:title — the headline text (keep under ~70 characters; X truncates beyond that).
twitter:description — the summary below the title (keep under ~200 characters).
twitter:image — the preview image URL. Must be publicly reachable over https.
twitter:image:alt — accessible alt text for the image (also helps the card pass accessibility audits).
twitter:site — the @handle of the website or publisher (used for follow prompts and attribution).
twitter:creator — the @handle of the individual author (optional but recommended for bylined content).

The tool normalises handles to start with @ and HTML-escapes all values so quotes and ampersands in your copy cannot break the generated markup.

How to use the output

Copy the generated tag block from the tool.
Paste it into the <head> element of your page, alongside any existing Open Graph tags.
Deploy and then test the URL in X’s Card Validator (cards.twitter.com/validator) to force a fresh crawl and confirm the card renders correctly.

X caches card data, so a new URL typically previews immediately, but changes to an existing URL can take a few hours to propagate after a re-crawl.

Tips

Default to summary_large_image for anything visual — it occupies more feed real estate and earns more engagement.
Always host the image at a public https URL. Images behind authentication, served over plain http, or blocked by robots.txt will not render.
If both Open Graph tags and twitter: tags are present, X uses the twitter: tags. If only Open Graph is present, X falls back to those. This builder outputs dedicated twitter: tags for precise control.
For summary_large_image, use a 2:1 aspect ratio image (for example 1200×600 pixels) at minimum 300×157 pixels. Smaller images trigger a fallback to the compact card layout.