Twitter/X Card Validator
Preview and validate Twitter/X cards before publishing. Check Open Graph tags, Twitter Card metadata, images, and common preview errors in one workflow.
Tool Input
This validator checks status code, robots signals, canonical URL, Twitter Card tags, Open Graph fallbacks, image quality, and common preview failures before you publish.
How to Preview Your Twitter Card
Preview
Paste the final public URL, not a local preview URL. The validator fetches the live page like a crawler and shows how the card may render on desktop, mobile, and Open Graph fallback paths.
Validate
Check whether the page returns a usable status code, whether the HTML includes the needed Twitter and Open Graph tags, and whether the image is reachable over HTTPS.
Diagnose
Look past the preview box. Compare the validation score, missing tags, image diagnostics, canonical value, robots directives, and fallback behavior to find the real failure point.
Fix
Copy the suggested meta tags or the Next.js metadata example, update the server-rendered HTML, then validate again until the card status is clean enough to publish.
Why Is My Twitter Card Not Showing?
| Problem | Common cause | Fix |
|---|---|---|
| Card does not appear at all | Missing twitter:card and weak Open Graph coverage | Add Twitter Card metadata or complete Open Graph fallbacks |
| Image does not appear | Image URL is blocked, invalid, relative, or not HTTPS | Use a public HTTPS image URL that returns 200 |
| Old image still appears | X is still using a cached preview | Change the image URL or wait for the preview cache to refresh |
| Wrong title appears | twitter:title or og:title is stale | Update the server-rendered title tags |
| Description is empty | Missing or blank description tags | Add twitter:description or og:description |
| Image is cropped badly | Aspect ratio does not fit the selected card type | Use the recommended ratio for the target card |
| Crawler cannot fetch the page | robots.txt, firewall, or bot protection blocks access | Allow X crawlers and remove blocking rules |
| Browser preview looks fine, X does not | Metadata is generated only in client-side JavaScript | Render metadata on the server |
Does X Use Twitter Card Tags or Open Graph Tags?
X still prefers Twitter Card metadata where it exists, but it can fall back to Open Graph values for title, description, and image. That is why a strong Twitter card validator should compare both sets of tags instead of treating them as separate systems.
| X needs | Priority tag | Fallback |
|---|---|---|
| Card type | twitter:card | No reliable Open Graph fallback |
| Title | twitter:title | og:title |
| Description | twitter:description | og:description |
| Image | twitter:image | og:image |
| URL | og:url | canonical |
Twitter Card Types Explained
summary
Compact layout with a smaller thumbnail. Useful for dense link previews and text-first posts.
summary_large_image
Large image layout that usually works best for articles, landing pages, and visual assets.
player
Interactive media card for supported audio or video embeds. Usually requires additional player metadata.
app
App promotion card designed for mobile installs and store metadata.
Twitter Card Meta Tags Reference
| Tag | Purpose | Notes |
|---|---|---|
| twitter:card | Defines the card type used by X | Required if you want explicit control over card format |
| twitter:title | Primary title for the X preview | Falls back to og:title when missing |
| twitter:description | Preview description for the X card | Falls back to og:description when missing |
| twitter:image | Primary preview image for X | Falls back to og:image when missing |
| twitter:image:alt | Accessibility text for the preview image | Recommended for accessibility and better semantics |
| og:title | Open Graph title used across platforms | Important fallback for X and other social surfaces |
| og:description | Open Graph description | Important fallback if Twitter-specific description is missing |
| og:image | Open Graph preview image | Supports X fallback behavior and other social previews |
| og:url | Normalized Open Graph URL | Helps align the preview with the canonical page URL |
| canonical | Preferred page URL | Useful for normalization and crawler consistency |
Summary Large Image example
<meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:title" content="Your page title" /> <meta name="twitter:description" content="A concise description" /> <meta name="twitter:image" content="https://example.com/image.jpg" /> <meta property="og:title" content="Your page title" /> <meta property="og:description" content="A concise description" /> <meta property="og:image" content="https://example.com/image.jpg" /> <meta property="og:url" content="https://example.com/page" />
Next.js metadata example
export const metadata = {
title: "Your page title",
description: "A concise description",
openGraph: {
title: "Your page title",
description: "A concise description",
images: ["https://example.com/image.jpg"],
},
twitter: {
card: "summary_large_image",
title: "Your page title",
description: "A concise description",
images: ["https://example.com/image.jpg"],
},
};Twitter Card Image Sizes
| Card type | Recommended size | Aspect ratio | Notes |
|---|---|---|---|
| summary_large_image | 1200 x 630 px | 1.91:1 | Under 5 MB and publicly reachable over HTTPS |
| summary | At least 144 x 144 px | Square or near-square | Keep it crisp and avoid tiny thumbnails |
Your Card Is Ready. Now Publish It at the Right Time.
Preview your link, write the post, and schedule it when your audience is most active with Volumn. You can also preview your X post, check whether your account is shadowbanned, calculate your X engagement rate, find the best time to post on X, estimate your X earnings, or explore free X tools. preview your X post, check whether your account is shadowbanned, calculate your X engagement rate, find the best time to post on X, estimate your X earnings, explore free X tools.
Twitter Card Validator FAQ
What is a Twitter Card Validator?
A Twitter Card Validator is a tool that checks whether a page has the metadata needed for a clean X or Twitter link preview. It reads tags such as twitter:card, twitter:title, og:title, og:description, and og:image, then shows how those values may be used when your URL is shared. A useful validator does more than show a mock preview. It also flags missing tags, weak fallbacks, broken images, and metadata issues that can stop cards from rendering correctly.
How do I preview a link before posting it on X?
Paste the URL into a Twitter card preview or X card validator tool before you publish. The tool should fetch the page like a crawler, inspect the server-rendered HTML, and show which Twitter Card and Open Graph tags are present. A stronger workflow also checks the image URL, card type, canonical URL, robots directives, and fallback behavior. That way you can validate the preview before your audience sees a broken title, missing image, or stale description on X.
Why is my Twitter Card not showing?
A Twitter Card usually fails because the page is missing key tags, the image cannot be fetched, or the metadata is not available in the initial server HTML. Common causes include a missing twitter:card tag, relative or non-HTTPS image URLs, blocked crawlers, noindex directives, stale cache, or metadata injected only after client-side JavaScript runs. The fastest way to diagnose it is to validate the final HTML, compare Twitter tags with Open Graph fallbacks, and inspect the image response directly.
What replaced Twitter's old Card Validator?
Twitter's older public validator no longer serves as a full preview workflow, so creators and developers now rely on independent Twitter card validator tools to inspect metadata and simulate previews. A useful replacement should not only render the card visually. It should also validate canonical tags, robots directives, Open Graph fallbacks, image size, status codes, and missing meta tags. In practice, the replacement is a better diagnostics tool rather than a simple one-click preview mirror.
Does X still support Twitter Card metadata?
Yes, X still supports Twitter Card metadata and still reads tags like twitter:card, twitter:title, twitter:description, and twitter:image. Those tags remain the clearest way to control how a shared link appears on X. At the same time, X can also fall back to Open Graph values when some Twitter-specific tags are missing. That is why a validator should inspect both sets of metadata together instead of pretending only one standard matters for link previews.
Does X use Open Graph tags?
Yes, X can use Open Graph tags as fallbacks when Twitter-specific tags are missing, especially for title, description, and image values. However, Open Graph is not a perfect substitute for every Twitter Card field. For example, twitter:card still matters because it influences card type, while og:url and canonical signals help with URL normalization rather than replacing card behavior entirely. In practice, the safest setup is to provide both Twitter Card metadata and solid Open Graph tags on the same page.
What size should a Twitter Card image be?
The most common recommendation for a summary_large_image card is roughly 1200 x 630 pixels, which is close to a 1.91:1 aspect ratio. Smaller square images can work for summary cards, but large preview cards usually perform better when the image is wide, publicly accessible, and under typical platform file-size limits. A good validator should check not only the nominal size, but also whether the URL is HTTPS, whether the image can be fetched, and whether the ratio is likely to crop badly on X.
Why is X showing an old preview image?
X can keep a cached version of your preview even after you update the page metadata or image. That means the card shown in the feed may lag behind the latest HTML for some time. In practice, old previews often persist because the platform has not refreshed its crawl yet, or because the image URL stayed the same. The simplest fix is to confirm the metadata is correct in the server HTML, then use a new image URL or wait for the cache to refresh.
Can JavaScript-generated metadata be detected by X?
JavaScript-generated metadata is unreliable for X if the critical tags are not already present in the initial server response. Crawlers usually work best with metadata that is rendered on the server and available in the raw HTML immediately. If your app injects twitter:title, og:image, or canonical tags only after hydration, the validator may show that your browser sees them while X does not. That is why server-side rendering or framework metadata APIs are the safer approach for link previews.
How long does X cache link previews?
X preview caching is not perfectly documented, so there is no guaranteed public time window for every page. In real workflows, cached previews can persist for hours or days depending on how often the URL is recrawled and whether the image URL changed. The practical takeaway is to treat preview caching as variable rather than instant. Validate the final HTML, confirm the correct image and tags are live, and expect that the feed may still show the older preview for a while.