What is the difference between summary and summary_large_image card types?

summary shows a thumbnail image to the left of the text (ideal for articles and product pages). summary_large_image shows a full-width image above the text (better for visual content like blog posts and news articles).

How do I validate my Twitter Card is set up correctly?

Use Twitter's Card Validator tool at developer.twitter.com/en/docs/twitter-for-websites/cards/guides/troubleshooting-cards. Enter your page URL to see if Twitter can fetch and render your card correctly.

What image dimensions work best for Twitter Cards?

For summary_large_image, use a 1200×628 or 2:1 ratio image with a minimum size of 300×157 pixels. Twitter enforces a 5MB maximum file size. PNG and JPG are both supported.

Lar FerramentasTwitter Card Generator

Gerador de cartões do Twitter

Name: Gerador de cartões do Twitter
Rating: 4.8 (120 reviews)
Author: DailyDevTools

Crie metatags de cartão do Twitter

Tipo de cartão

Identificador do site (por exemplo, @twitter)

Título

Descrição

URL da imagem

Visualização

Título do cartão

A descrição vai aqui...

Example.com

HTML gerado

<meta name="twitter:card" content="summary_large_image" />

Use these tools directly in Chrome

Install the DailyDevTools extension — access all tools from your browser toolbar

Add to Chrome

What is Twitter Card Generator?

Twitter Cards are meta tags that control how URLs appear when shared on Twitter/X — showing a rich preview card with image, title, and description instead of a plain URL. There are four card types: summary, summary_large_image, app, and player. DailyDevTools' Twitter Card Generator creates the correct meta tags and shows a live preview of how your link will look when tweeted.

How to use Twitter Card Generator

1Select your card type: Summary (small image) or Summary Large Image (full-width banner)
2Fill in the title, description, and image URL
3Optionally add your Twitter handle to the twitter:site and twitter:creator fields
4Preview the card and copy the HTML meta tags to your page's head section

Frequently asked questions

Comments

Você também pode gostar

Explore outras ferramentas populares para desenvolvedores

Visualização de redução

Editor e visualização de Markdown em tempo real

Lorem Ipsum

Gerar texto de espaço reservado para designs

Contador de palavras

Conte palavras, caracteres e tempo de leitura

Downloader de miniaturas

Obtenha miniaturas de vídeos do YouTube