Meta Tag Generator

Continue in the tool

More pages for this tool

twitter card generator

Twitter Card generator

In this tool, twitter:title and twitter:description have no field of their own: the generator always copies the resolved og:title and og:description, with no option to diverge. Only twitter:card, twitter:site, twitter:creator and twitter:image are independent fields; everything else comes from the Open Graph block you already filled in.

Two fixed formats, a borrowed image, an unaddressed warning

summary_large_image, this tool's default, wants a 2:1 image ratio, with a 300×157-pixel floor and a 5 MB file ceiling; summary uses a small, near-square thumbnail beside the text, with no such ratio requirement. The choice between the two is the only field with fixed options in this section of the tool; site, creator and image stay free text.
twitter:image is the only media field with a value of its own: leave it blank and the generator uses the exact resolved og:image, no separate upload or URL required. That means a broken or insecure http og:image also hits the X card by extension, because both fields point to the same address whenever twitter:image is left empty.
twitter:site and twitter:creator only trigger a warning when the value does not start with "@": it is an info-level alert, not an error that blocks generation, and the same warning code covers both fields without saying which one is wrong, so filling in both handles without "@" at the same time produces a single warning in the list, not two separate ones.

What changes between the two formats

This tool's default card

Input: card = summary_large_image
Expected output: proporção recomendada 2:1, piso 300×157 px, teto 5 MB

Different from the 1200×630 (~1.91:1) og:image; the same image serves both, with a small crop on the sides.

Inherited image

Input: twitter:image em branco, og:image = https://exemplo.com.br/og/ssr-next-js.png
Expected output: <meta name="twitter:image" content="https://exemplo.com.br/og/ssr-next-js.png" />

twitter:image copies the resolved og:image when the field is left empty; there is no need to upload the image again.

Handle without @

Input: site = exemplo (sem @)
Expected output: aviso informativo: formato de handle

The tag ships as typed even with the warning; the "@" is not added automatically.

Full tool FAQ

What is the difference between the <title> tag and <h1>?

The <title> lives in the <head> and sets the browser tab text and the search snippet title; it is a whole-page signal. The <h1> is the visible heading inside the content. They can have different text: the title is usually more concise and tuned for the SERP, while the h1 speaks directly to someone already on the page. Do not conflate them or repeat the exact same text without reason.

Does the meta keywords tag still help with SEO?

What is the canonical tag and when should I use it?

What is the difference between noindex, nofollow and robots.txt?

Why are Open Graph and Twitter Card separate sets of tags?

Is there an ideal length for title and meta description?

Does generating these meta tags improve my ranking automatically?

Is the data I type here sent to any server?

Frequently asked questions

Can I write a twitter:title different from og:title in this tool?

No. This tool exposes no dedicated field for twitter:title or twitter:description: both always copy the already-resolved og:title and og:description. It is a design choice that keeps the X card and the WhatsApp/LinkedIn card from drifting apart in text by accident.

Why does switching from summary to summary_large_image change the image I need to prepare?

Because the two formats ask for different ratios: summary uses a small, near-square thumbnail, while summary_large_image wants a wide image at a 2:1 ratio, at least 300×157 pixels. An image prepared for og:image (1200×630, ~1.91:1) works well for both, with a small crop at the edges.

Does the missing-@ handle warning stop the HTML from being generated?

No. It is an info-level warning, not a blocking error: the generator still assembles twitter:site or twitter:creator with exactly the value you typed, with or without a leading '@'. The warning only exists to flag it, fixing the text is left to you.

Next steps

<title>Guia completo de SSR no Next.js</title> <meta name="description" content="Aprenda quando usar renderização no servidor, streaming e cache no Next.js, com exemplos práticos e armadilhas comuns de performance." /> <link rel="canonical" href="https://exemplo.com.br/blog/ssr-next-js" /> <meta name="robots" content="index, follow" /> <meta property="og:title" content="Guia completo de SSR no Next.js" /> <meta property="og:description" content="Aprenda quando usar renderização no servidor, streaming e cache no Next.js, com exemplos práticos e armadilhas comuns de performance." /> <meta property="og:type" content="article" /> <meta property="og:url" content="https://exemplo.com.br/blog/ssr-next-js" /> <meta property="og:image" content="https://exemplo.com.br/og/ssr-next-js.png" /> <meta property="og:image:alt" content="Diagrama de renderização no servidor com Next.js" /> <meta property="og:site_name" content="Exemplo" /> <meta property="og:locale" content="pt_BR" /> <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:site" content="@exemplo" /> <meta name="twitter:creator" content="@exemplo" /> <meta name="twitter:title" content="Guia completo de SSR no Next.js" /> <meta name="twitter:description" content="Aprenda quando usar renderização no servidor, streaming e cache no Next.js, com exemplos práticos e armadilhas comuns de performance." /> <meta name="twitter:image" content="https://exemplo.com.br/og/ssr-next-js.png" />

Continue in the tool

Open full tool

twitter card generator

Twitter Card generator

Two fixed formats, a borrowed image, an unaddressed warning

summary_large_image, this tool's default, wants a 2:1 image ratio, with a 300×157-pixel floor and a 5 MB file ceiling; summary uses a small, near-square thumbnail beside the text, with no such ratio requirement. The choice between the two is the only field with fixed options in this section of the tool; site, creator and image stay free text.

twitter:image is the only media field with a value of its own: leave it blank and the generator uses the exact resolved og:image, no separate upload or URL required. That means a broken or insecure http og:image also hits the X card by extension, because both fields point to the same address whenever twitter:image is left empty.

twitter:site and twitter:creator only trigger a warning when the value does not start with "@": it is an info-level alert, not an error that blocks generation, and the same warning code covers both fields without saying which one is wrong, so filling in both handles without "@" at the same time produces a single warning in the list, not two separate ones.

What changes between the two formats

This tool's default card

Input: card = summary_large_image
Expected output: proporção recomendada 2:1, piso 300×157 px, teto 5 MB

Different from the 1200×630 (~1.91:1) og:image; the same image serves both, with a small crop on the sides.

Inherited image

Input: twitter:image em branco, og:image = https://exemplo.com.br/og/ssr-next-js.png
Expected output: <meta name="twitter:image" content="https://exemplo.com.br/og/ssr-next-js.png" />

twitter:image copies the resolved og:image when the field is left empty; there is no need to upload the image again.

Handle without @

Input: site = exemplo (sem @)
Expected output: aviso informativo: formato de handle

The tag ships as typed even with the warning; the "@" is not added automatically.

Full tool FAQ

What is the difference between the <title> tag and <h1>?

Does the meta keywords tag still help with SEO?

What is the canonical tag and when should I use it?

What is the difference between noindex, nofollow and robots.txt?

Why are Open Graph and Twitter Card separate sets of tags?

Is there an ideal length for title and meta description?

Does generating these meta tags improve my ranking automatically?

Is the data I type here sent to any server?

Frequently asked questions