Stop guessing what your links look like on Twitter
You share a link on X. The card shows a broken image, a truncated title, or worse, nothing at all. Looks amateur. Feels embarrassing. And fixing it means pushing a code change, waiting for Twitter’s cache to clear, and checking again.
This tool lets you preview the card before it goes live. Type in your title, description, and image URL. Pick between summary and summary_large_image card types. See exactly how Twitter will render your link. When it looks right, copy the generated meta tags and drop them into your HTML head.
No trial and error. No cache-clearing rituals. Get it right the first time.
Setting up your card preview
- Enter your page title. Twitter truncates around 70 characters, so the tool shows you exactly where the cutoff happens.
- Write a description. This appears below the title in the card. Keep it under 200 characters for best results.
- Add your image URL. This is the image that appears in the card. Twitter recommends 1200x628 for summary_large_image cards and 120x120 minimum for summary cards.
- Enter your site handle (optional). This shows up as the card’s attribution.
- Select the card type. Summary gives a small image to the left. Summary with Large Image shows a big banner image above the text.
The live preview updates as you type. The meta tag output updates simultaneously.
Card types explained
Summary: the compact card. Shows a small square thumbnail on the left, with your title and description on the right. Best for articles, blog posts, and content where the text matters more than the visual.
Summary with Large Image: the attention grabber. A full-width image banner at the top, with title and description below. This is what you want for product launches, portfolio pieces, landing pages, and anything where the visual needs to hit first.
Most sites default to summary_large_image because bigger images get more clicks. But if your image isn’t compelling, the smaller summary card might actually perform better. Test both.
The meta tags this generates
The tool outputs both Twitter-specific meta tags and standard Open Graph tags. That means the same tags work for Facebook, LinkedIn, Discord, Slack, and basically every platform that reads OG metadata. You get:
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Your Title" />
<meta name="twitter:description" content="Your Description" />
<meta name="twitter:image" content="https://..." />Copy the whole block and paste it inside your page’s <head> tag. That’s it. One set of tags, every platform covered.
Common mistakes that ruin Twitter cards
Wrong image dimensions. Twitter’s minimum is 120x120 for summary and 300x157 for summary_large_image. Go below that and the image gets dropped entirely. The sweet spot is 1200x628.
Missing og:image. If you only include the Twitter tags and skip the og:image, some platforms won’t show an image at all. This tool generates both sets.
Cache issues. Twitter caches card data aggressively. If you update your tags, you need to re-scrape the URL using Twitter’s Card Validator. The tool can’t fix caching, it can only make sure your tags are correct before they go live.
Twitter card questions
Do I need both Twitter and Open Graph tags?
Technically, Twitter falls back to OG tags if Twitter-specific tags are missing. But including both ensures consistent behavior across all platforms. The generated output covers both.
My card image isn’t showing, what gives?
Check three things: Is the image URL publicly accessible? Is it at least 120x120 pixels? Is it served over HTTPS? Twitter won’t display images from HTTP URLs or private servers.
How long until Twitter shows my updated card?
After updating your meta tags, use Twitter’s Card Validator to force a re-scrape. Otherwise, the cache can take hours or even days to refresh. There’s no way to speed it up besides the validator.
What about LinkedIn and Facebook previews?
The Open Graph tags this tool generates work for those platforms too. LinkedIn has its own Post Inspector tool, and Facebook has the Sharing Debugger, but the underlying tags are the same.