Meta Tag Generator

Generate optimized HTML meta tags for SEO and social media sharing (Open Graph & Twitter Cards).

Page Details

Generated Meta Tags

 
 
  
 
Google Preview
 
 
Page Title
 
https://example.com/page
 
Brief description of the page...
 
 
 
 
 
                                                                              
  
 
 
 edit_note
By Utility Spark Editorial Team 
 
 fact_check
Reviewed by Senior Editor 
 
 verified
Reviewed: Jul 28, 2026 
 
 update
Updated: Jul 28, 2026 
 
 commit
v2.0.0 
 
 schedule 6 min read 
 
 
 
 
   
  
 
 
 lightbulb
When to use this tool

 
     
  •  check_circle Setting up the complete  meta tag section for a new website page, product landing page, or blog post. 
  •  check_circle Ensuring a blog post or article generates a rich preview card with correct title, description, and image when shared on social media. 
  •  check_circle Generating Open Graph tags for a product page to control how it appears when shared in WhatsApp groups or LinkedIn posts. 
  •  check_circle Adding Twitter Card meta tags to ensure your article appears with a large image card rather than a plain link on X (Twitter). 
  •  check_circle Auditing and regenerating meta tags for existing pages where the current tags are missing or incorrectly formatted. 
    •  
 
 
 
 
Why use our tool?
 
 
 
Three Tag Sets in One Generator — SEO + Open Graph + Twitter Card
 
   
  
 
Character Count Warnings for Critical Fields
 
   
  
 
Open Graph Image Preview
 
   
  
 
Robots Tag Builder with Common Combinations
 
   
  
 
Clean, Copy-Ready HTML Output
 
   
  
 
 
 
 
How it works
 
 
 
 1 
 
Enter your page title (target: 50–60 characters including the primary keyword near the front).
 
 
 2 
 
Enter your meta description (target: 140–155 characters — compelling summary of the page's value).
 
 
 3 
 
Enter the canonical page URL.
 
 
 4 
 
Enter the OG image URL (must be an absolute URL; recommended minimum 1200×630px).
 
 
 5 
 
Set Open Graph type (website for homepages/landing pages, article for blog posts), author, and site name.
 
 
 6 
 
Click 'Generate Tags' to produce the HTML code block.
 
 
 7 
 
Copy the full code block and paste it inside your HTML page's  section, replacing any existing meta tags for the same properties.
 
 
 
 
 
Examples
 
 
 
 science Blog Post Meta Tags 
 
   
  
 
 science Product Landing Page 
 
   
  
 
 
 
 
Frequently Asked Questions
 
 
  Do Open Graph tags replace regular SEO meta tags? expand_more  
No — they serve different purposes and you need both. Regular SEO meta tags (title, description, robots) control how search engines read and display your page in search results. Open Graph tags (og:title, og:description, og:image) control how your page appears when shared as a link on social platforms like Facebook, LinkedIn, and WhatsApp — which have their own scrapers that read og: tags specifically. Twitter Card tags serve the same function for X. All three sets should be present and correctly filled on every page.
 
  Do I need Twitter Card tags if I already have Open Graph tags? expand_more  
Yes, if you want correct display on X (Twitter). While X does fall back to Open Graph tags when Twitter Card tags are absent, the fallback is not always consistent across all X clients and card types. Explicitly setting Twitter Card tags (twitter:card, twitter:title, twitter:description, twitter:image) ensures your content displays correctly as a summary_large_image card rather than a basic link on all X platforms. This generates rich previews that significantly increase click-through rates on shared links.
 
  What is the correct og:image size for social media sharing? expand_more  
The universally recommended og:image dimensions are 1200×630 pixels (1.91:1 ratio). This size displays well on Facebook, LinkedIn, WhatsApp, X, and Slack without cropping. Minimum acceptable size is 600×315px, but smaller images may be cropped or displayed poorly on some platforms. The image file size should be under 8MB. Always use an absolute URL (https://...) not a relative path — social platform scrapers cannot resolve relative URLs.
 
  What are canonical tags and should I include them? expand_more  
A canonical tag (rel='canonical') tells search engines which URL is the 'master' version of a page when duplicate or near-duplicate content exists at multiple URLs (e.g., product pages accessible via multiple category paths, or the same content served at both www and non-www versions of a domain). The canonical tag helps consolidate ranking signals and prevent duplicate content issues. It should be set to the preferred URL for every page — even pages without obvious duplicates benefit from a self-referential canonical tag as a best practice.
 
  What robots meta tag values should I use? expand_more  
For pages you want indexed and followed: content='index, follow' (or omit the tag entirely — this is the default). For pages you want to keep out of Google's index (login pages, internal admin tools, thank-you pages, duplicate filter combinations in e-commerce): content='noindex, nofollow'. For pages whose links you want followed but content not indexed (category pages with thin content): content='noindex, follow'. For pages whose content you want indexed but links not followed (paid links, sponsored content): content='index, nofollow'.
 
  How do I test whether my meta tags and Open Graph tags are working correctly? expand_more  
Use the official platform debugging tools: Facebook Sharing Debugger (developers.facebook.com/tools/debug) shows how Facebook reads your og: tags and renders the preview card. X Card Validator (cards-dev.twitter.com/validator) tests Twitter Card tags. LinkedIn Post Inspector (linkedin.com/post-inspector) validates LinkedIn sharing. Google Rich Results Test (search.google.com/test/rich-results) tests structured data. After updating meta tags, use these tools to re-scrape your URL and confirm the new tags are being read correctly — platforms cache sharing data and may show outdated information until you force a re-scrape.
 
 
 
  
     
 
More SEO & Webmaster Tools
 
  
 
 
 gradient 
  
 
CSS Gradient Generator
 
Create beautiful CSS linear and radial gradients with an interactive color stop editor.
 
 
Open Tool
arrow_forward  
 
  
 
 
 data_object 
  
 
JSON Formatter & Validator
 
Beautify, validate, and minify JSON data with exact syntax error detection and tree-view visualization.
 
 
Open Tool
arrow_forward  
 
  
 
 
 qr_code 
  
 
QR Code Generator
 
Instantly generate custom, scannable QR codes for URLs, text, Wi-Fi, and contact information.
 
 
Open Tool
arrow_forward  
 
  
 
 
 barcode 
  
 
Barcode Generator
 
Instantly generate standard scannable 1D barcodes (like CODE128, EAN, UPC) for your retail products and inventory management.
 
 
Open Tool
arrow_forward