Twitter Card Generator
Generate Twitter/X card meta tags for social link previews.
Back to all tools on ToolForge
Card Type:
Title:
Description:
Image URL:
Site Handle:
About Twitter Card Generator
This Twitter Card generator creates Twitter/X card meta tags so shared links can show the right title, description and image.
It is useful for blog posts, product pages and campaign links when you want a more polished preview on social feeds instead of a bare URL.
Twitter Card Types Explained
| Card Type | Layout | Best For |
|---|---|---|
| summary | Small thumbnail (120x120px) beside text | Articles, blog posts, general content |
| summary_large_image | Large banner image (800x418px) above text | Product pages, featured content, visual posts |
| app | App icon with install buttons | Mobile app promotion (requires app-specific tags) |
| player | Embedded media player | Video, audio, or interactive content |
Twitter Card Image Requirements
- Summary card: Minimum 120x120px, recommended 300x300px, max 5MB
- Summary Large Image: Minimum 800x418px, recommended 1200x627px (1.91:1 ratio), max 5MB
- Formats: JPG, PNG, GIF (animated GIFs supported)
- URLs: Must use absolute HTTPS URLs for reliable rendering
- Aspect ratio: 1:1 for Summary, 1.91:1 for Large Image
Character Count Guidelines
Recommended character limits: Title: Under 70 characters (no hard limit, but longer titles may be truncated) Description: 200 characters or less for optimal display Image alt: Up to 480 characters for accessibility Note: Twitter does not enforce strict character limits for Card tags, but shorter, focused text performs better in social feeds.
Complete Twitter Card Meta Tags Example
<!-- Twitter Card Meta Tags --> <meta name="twitter:card" content="summary_large_image"> <meta name="twitter:title" content="Your Page Title"> <meta name="twitter:description" content="Your page description here"> <meta name="twitter:image" content="https://example.com/image.jpg"> <meta name="twitter:site" content="@yourhandle"> <meta name="twitter:creator" content="@authorhandle"> <meta name="twitter:image:alt" content="Description of image for screen readers">
Twitter Card vs Open Graph Tags
Twitter Cards and Open Graph tags serve similar purposes but are used by different platforms:
| Platform | Uses |
|---|---|
| Twitter/X | twitter:card, twitter:title, etc. |
| og:title, og:description, og:image | |
| og: tags (falls back to Open Graph) | |
| Slack | og: tags (falls back to Open Graph) |
Best practice: Include both Twitter Card and Open Graph tags for complete social media coverage.
Common Twitter Card Issues
- Image not showing: Ensure URL is absolute (https://) and publicly accessible
- Wrong card type: Verify twitter:card value is exactly "summary" or "summary_large_image"
- Cached preview: Twitter caches card data; re-validate URL to refresh cache
- Tags in wrong place: Meta tags must be in the section, not
- Image too small: Meet minimum size requirements or Twitter will fall back to Summary card
Testing and Validation
After adding Twitter Card tags to your page:
- Visit Twitter Card Validator
- Enter your page URL and click "Preview Card"
- Review the preview and fix any issues shown
- If you've updated tags but see old preview, re-validate to clear cache
How to Generate Twitter Card Tags
- Select card type: Choose "summary" for small thumbnail or "summary_large_image" for large banner display.
- Enter title: Add your page or post title (under 70 characters recommended).
- Add description: Write a brief, compelling description (200 characters or less).
- Provide image URL: Enter the full HTTPS URL to your card image.
- Optional - Add site handle: Include your Twitter account (e.g., @yourbrand) to attribute the shared content.
- Generate and copy: Click "Generate" to create the meta tags, then "Copy Tags" to paste them into your page's section.
Tips
- Use high-quality images that meet size requirements
- Test your tags with Twitter's Card Validator before publishing
- Include both Twitter Card and Open Graph tags for cross-platform compatibility
- Keep text concise and focused on driving engagement
Frequently Asked Questions
- What are the different Twitter Card types?
- Twitter supports four card types: Summary (small thumbnail, 120x120px), Summary Large Image (large 800x418px image), App Card (for mobile app installs), and Player Card (for embedded media). Summary and Summary Large Image are the most commonly used for general web pages.
- What are the recommended image sizes for Twitter Cards?
- For Summary cards: minimum 120x120px, recommended 300x300px. For Summary Large Image: minimum 800x418px, recommended 1200x627px (1.91:1 ratio). Maximum file size is 5MB for GIF, 15MB for JPG/PNG. Use absolute HTTPS URLs for reliable rendering.
- How long should Twitter Card titles and descriptions be?
- Twitter Card titles should be under 70 characters to avoid truncation. Descriptions should be 200 characters or less for optimal display. While Twitter doesn't enforce strict limits, shorter, punchier text performs better in the social feed context.
- How do I test if my Twitter Card meta tags are working?
- Use Twitter's Card Validator at cards-dev.twitter.com/validator to preview how your page will appear when shared. Enter your page URL and Twitter will fetch the meta tags and show you a live preview. You may need to validate a URL once to clear Twitter's cache if you've updated tags.
- Do I need both Twitter Card and Open Graph tags?
- Yes, it's recommended to include both. Twitter Card tags are used specifically by Twitter/X, while Open Graph tags are used by Facebook, LinkedIn, and other platforms. Twitter will fall back to Open Graph tags if Twitter-specific tags are missing, but using both ensures consistent previews across all social platforms.
- What is the @twitter:site handle and should I include it?
- The twitter:site tag specifies your official Twitter account handle (e.g., @toolforge). Including it attributes the shared content to your account and can help with brand recognition. It's optional but recommended for business or brand accounts to increase visibility and engagement.