Twitter/X Card Generator

Build the meta tag block for Twitter/X link previews.

Up to 200 characters.

Accessibility text for the preview image.

@ will be added automatically if missing.

@ will be added automatically if missing.

Twitter/X card generator for rich link previews

Twitter cards (now X cards) are the rich previews that appear when a link is posted on Twitter/X — a headline, description, and image rendered as a clickable card instead of a bare URL. They are controlled by a handful of meta tags in your page head: twitter:card, twitter:title, twitter:description, twitter:image, and optional attribution tags twitter:site and twitter:creator.

This Twitter card generator builds that meta tag block from a form. Choose a card type — summary_large_image for a full-width image card, summary for a compact thumbnail card, or app and player for app installs and embedded media — then fill in the title, a description of up to 200 characters, and the image URL. An image is required for summary and summary_large_image cards, and the tool enforces that before producing output. You can also add alt text for the image and your site and creator handles; the @ prefix is added automatically if you leave it off.

The tags are generated and HTML-escaped entirely in your browser. Copy the block into the head element of your page and the next time the URL is shared on X, the card renders with your chosen content. X also falls back to Open Graph tags for missing fields, so the two tag sets work well together.

How to create Twitter/X card tags

  1. Pick a card type

    Choose summary_large_image for a big image card, summary for a compact card, or app and player for specialized cards.

  2. Add a title and description

    Both are required. Keep the description under 200 characters so it displays in full.

  3. Set the image and alt text

    Paste a full image URL — required for summary and summary_large_image cards — and optionally add image alt text for accessibility.

  4. Add your handles

    Fill in the site handle and creator handle if you want attribution; the @ is added automatically if missing.

  5. Copy the tags

    Click Copy tags and paste the block into the head element of your page.

Frequently asked questions

What is the difference between summary and summary_large_image?

A summary card shows a small square thumbnail beside the title and description, while summary_large_image shows a full-width image above them. Most sites use summary_large_image because it takes up more space in the feed.

What image size do Twitter/X cards need?

For summary_large_image use a 2:1 image of at least 300x157 pixels, with 1200x628 or 1200x630 being the common choice. For summary cards use a square image of at least 144x144 pixels.

What is twitter:site vs twitter:creator?

twitter:site is the handle of the website or publication the content belongs to, while twitter:creator is the handle of the individual author. You can set both, and they can be the same account.

Do I still need Twitter card tags if I have Open Graph tags?

X falls back to og:title, og:description, and og:image when the twitter equivalents are missing, so OG tags alone often work. Adding twitter:card is still recommended because it controls which card format is used.

How do I test my Twitter/X card before posting?

Publish the tags on your page, then compose a post with the URL on X to see the rendered preview, or use the Card Validator while it is available. Cached previews can take time to refresh after tag changes.

Make every share look intentional.

ReSlug lets you customize how each short link previews on social, including Twitter/X cards. Override on a per-link basis without touching code.

Create a free account