--- title: Free Twitter Card Generator slug: twitter-card-generator last_reviewed: 2026-08-09 author: editorial source: LemAudit Free Tools --- ## Intro A Twitter card is the preview box that appears when someone shares your link on X. Get it right and a link becomes a headline, a summary and a large image, which is roughly three times the visual space of a bare URL. Get it wrong and the post shows a naked link, which people scroll past. The tags themselves are simple: a card type, a title, a description, an image. What makes them fiddly is that X falls back to Open Graph tags when a `twitter:` tag is absent, so a page can end up with two competing sources of truth. If your `og:title` is the site name and your `twitter:title` is the article headline, different surfaces show different things. This generator writes both blocks from one set of answers, so they cannot drift. Everything runs in your browser. Nothing you type is sent to a server or logged. ## Choosing a card type **summary_large_image** is the default for almost everything: a full-width image above the title and description. Use it for articles, tools, product pages and landing pages. The image needs to be at least 300 by 157 pixels, and 1200 by 630 renders cleanly at every size. Keep the file under 5MB. **summary** shows a small square thumbnail beside the text. It suits pages where the image is a logo or an avatar rather than a scene, and it takes far less vertical space in a feed. The minimum is 144 by 144. **player** embeds a video or audio player inline. It requires extra tags for the player URL and its dimensions, and X reviews player cards manually before they render for anyone but you. Treat it as a project, not a checkbox. **app** promotes a mobile app install. It needs app IDs per platform and ignores your image entirely. ## The rules that actually break previews **HTTPS, always.** X will not fetch an image over plain HTTP. This is the most common cause of a card that works locally and disappears in production. **Absolute URLs.** A relative image path resolves against nothing on X's crawler. Always include the scheme and host. **Length limits.** Titles are truncated around 70 characters, descriptions around 200. The generator counts as you type. Front-load the meaning so the truncated version still reads well. **The crawler must be allowed in.** X reads your page with a bot called `Twitterbot`. If `robots.txt` blocks it, or a firewall rule challenges unknown user agents, no tags are read and no card renders regardless of how correct your markup is. **Caching is aggressive.** Once X has scraped a URL, it holds the preview for days. Change an image and the old one keeps appearing. Force a refresh through the X card validator, or append a harmless query parameter to the shared URL for a one-off test. ## Alt text is not optional `twitter:image:alt` is read aloud by screen readers and shown when an image fails to load. It takes ten seconds to write and is skipped on the overwhelming majority of sites. Describe what the image shows, not what the page is about: "Bar chart showing 68% of audited sites missing structured data" rather than "SEO audit tool". ## Where to put the tags In the ``, alongside your other meta tags, and rendered server-side. This is the part that trips up single-page applications. Tags injected by JavaScript after the page loads are invisible to X's crawler, because it does not execute JavaScript. If your framework only sets meta tags on the client, every link you share will show the same default preview no matter what the page is. Server rendering or a pre-render step is the only real fix, and it is worth knowing before you spend an afternoon debugging your tags rather than your delivery. ## FAQ ### Do I still need twitter tags if I have Open Graph? Not strictly. X reads `og:title`, `og:description` and `og:image` when the twitter equivalents are absent. Add `twitter:card` at minimum, because that is what selects the large-image layout; without it you get the small summary style. ### Why does my card show the wrong image? Almost always the cache. X keeps a previous scrape for days. Run the URL through the card validator to force a refresh, and check that the new image is absolute, HTTPS and under 5MB. ### Can I use a different image for X than for Facebook? Yes. Set `og:image` for Facebook and LinkedIn, and `twitter:image` for X. That is the main reason to output both blocks rather than relying on the fallback. ### Does the card affect SEO? Not directly. Google does not rank pages on Twitter tags. It affects click-through on shared links, which drives traffic and, over time, links. The effect is real but indirect. ### What size image should I use? 1200 by 630 for summary_large_image. It downscales cleanly, matches the ratio X crops to, and doubles as your Open Graph image so you only make one file. ### My card works for me but not for others. Why? Player and app cards need approval from X before they render for other accounts. For summary cards, this pattern usually means the page is behind authentication or a bot challenge, so the crawler sees a login screen while you see the page.