Twitter Card Image Size Guide (2026)

Twitter (now X) cards are the preview images that appear when you share a link. Getting the dimensions right is the difference between a professional-looking share and an awkwardly cropped thumbnail.

Quick answer

Use 1200 x 630 pixels, PNG format. This works for both summary_large_image and regular summary cards.

Card types

Summary Card with Large Image (recommended)

This is the most common type — a large image with title and description below.

<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Your Page Title" />
<meta name="twitter:description" content="A brief description" />
<meta name="twitter:image" content="https://example.com/og.png" />

Image specs:

• Size: 1200 x 630 (1.91:1 ratio)
• Min: 300 x 157
• Max file size: 5MB
• Format: PNG, JPEG, GIF, WEBP

Summary Card (small thumbnail)

A smaller square thumbnail with text to the right.

<meta name="twitter:card" content="summary" />
<meta name="twitter:image" content="https://example.com/og.png" />

Image specs:

• Size: 1200 x 1200 (1:1 ratio, but 1200x630 also works — it gets cropped to center)
• Min: 144 x 144

Pro tip: use both OG and Twitter tags

Twitter falls back to Open Graph tags if Twitter-specific tags aren't present. But for maximum control, set both:

<!-- Open Graph (Facebook, LinkedIn, Slack, etc.) -->
<meta property="og:image" content="https://example.com/og.png" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />

<!-- Twitter/X specific -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:image" content="https://example.com/og.png" />

In Next.js, the metadata API handles this for you:

export const metadata = {
  openGraph: {
    images: [{ url: "/og.png", width: 1200, height: 630 }],
  },
  twitter: {
    card: "summary_large_image",
    images: ["/og.png"],
  },
};

Common issues

Image not showing

1. Check that the URL is absolute (starts with https://)
2. Verify the image is publicly accessible (not behind auth)
3. Clear Twitter's cache using Card Validator
4. Ensure file size is under 5MB

Image looks blurry

• Use PNG instead of JPEG for text-heavy images
• Ensure the image is exactly 1200x630, not upscaled from a smaller size

Old image showing

Twitter caches aggressively. After changing an OG image:

1. Go to Card Validator
2. Enter your URL
3. Click "Preview card" — this forces a cache refresh

Generating Twitter card images automatically

Instead of creating images manually for each page, use an API to generate them dynamically:

curl "https://snap-og.com/api/og?title=Your+Title&template=bold&theme=dark" \
  -H "Authorization: Bearer YOUR_API_KEY" \
  -o twitter-card.png

The bold template with dark theme works especially well for Twitter cards — high contrast text on a dark background stands out in feeds.

Try generating a Twitter card image free — no signup required.