Meta Tag Generator: Create HTML Meta Tags for SEO and Social Sharing
Generate complete HTML meta tags for SEO, Open Graph (Facebook), and Twitter Cards. Fill in the fields and copy the ready-to-use HTML.
Try the free online tool
Runs entirely in your browser — no signup, no uploads.
Meta tags are snippets of HTML placed in the `<head>` of a web page that provide structured information about the page to search engines, social media platforms, and browsers. Getting them right is one of the quickest ways to improve how your pages appear in search results and when shared on social networks like Facebook, Twitter, and LinkedIn.
There are three key sets of meta tags every page should have: the standard HTML meta tags (`title`, `description`, `robots`, `canonical`), Open Graph tags used by Facebook, LinkedIn, and most social platforms, and Twitter Card tags used by Twitter/X for rich previews. Each set has its own tag names and rules — keeping track of all of them manually is tedious and error-prone.
This meta tag generator collects your page information through a simple form and outputs a complete, copy-ready block of HTML meta tags covering all three sets — so you can paste them into your page's `<head>` and be done.
What Are HTML Meta Tags?
HTML meta tags are `<meta>` elements placed inside the `<head>` section of an HTML document. They do not affect the visible content of a page but provide metadata that browsers, search engines, and social media crawlers use to understand and represent the page.
The most important meta tags for SEO are the `<title>` element (the page title shown in browser tabs and search results), `<meta name='description'>` (the short summary shown under the title in search results), and `<link rel='canonical'>` (the preferred URL for the page, preventing duplicate content issues).
Open Graph (OG) tags, introduced by Facebook, are `<meta property='og:*'>` tags that control how a page appears when shared on social media — the title, description, image, and URL shown in the link preview. Twitter Cards use `<meta name='twitter:*'>` tags for the same purpose on Twitter/X, with slightly different fields and card layout options.
How to Use This Tool
Fill in the form and get a complete block of meta tags to paste into your page.
- 1
Enter page details
Fill in the page title (50–60 characters), meta description (150–160 characters), and the canonical URL of the page.
- 2
Add social sharing details
Enter the Open Graph title, description, and image URL (recommended: 1200x630 pixels). These control how your page looks when shared on Facebook and LinkedIn.
- 3
Configure Twitter Card
Select the card type (summary, summary_large_image, app, or player), and enter your Twitter handle and any Twitter-specific title or description overrides.
- 4
Set robots directives
Choose whether search engines should index the page and follow its links using the robots meta tag options (index/noindex, follow/nofollow).
- 5
Copy the generated HTML
Click 'Copy' to grab the full block of meta tags and paste them into the `<head>` section of your HTML or your CMS's head tag settings.
Common Use Cases
Meta tag generation is essential for any website that cares about search visibility and social sharing.
- Setting up a new web page — adding complete meta tags to a new page or landing page to ensure it's properly indexed and shareable from day one.
- Optimizing existing pages — reviewing and updating meta tags on existing pages to improve click-through rates in search results.
- Building CMS templates — generating reference meta tag structures to implement in WordPress, Webflow, or other CMS head tag settings.
- Preparing content for social campaigns — ensuring blog posts and landing pages have the right OG image and description before a social media push.
- Auditing a site for missing tags — using the generated reference to compare against a site's existing tags to identify gaps.
Tips and Best Practices
Follow these guidelines for effective meta tag implementation.
- Keep titles under 60 characters — search engines truncate longer titles in results, so make sure the key message fits within the limit.
- Write meta descriptions that are compelling and action-oriented — while they don't directly affect rankings, a well-written description improves click-through rates from search results.
- Always specify an OG image — pages without an Open Graph image look bland when shared and get far fewer clicks from social media.
- Use the canonical tag consistently — always point to the preferred version of a URL (with or without trailing slash, www or non-www) to avoid duplicate content penalties.
- Test your tags — use Facebook's Sharing Debugger, Twitter's Card Validator, and Google's Rich Results Test to verify your tags before publishing.
Frequently Asked Questions
What is the difference between the title tag and og:title?
The `<title>` element controls what appears in the browser tab and in search engine results. The `og:title` tag controls the title shown in social media link previews. They can be different — you might want a shorter or more engaging title for social sharing than the one used for SEO.
What size should the Open Graph image be?
The recommended size is 1200x630 pixels (roughly 1.91:1 aspect ratio). This size works well across Facebook, LinkedIn, Slack, and most other platforms. Images smaller than 600x315 may not display as a large preview card.
Do Twitter Cards require Open Graph tags too?
Twitter falls back to Open Graph tags when Twitter-specific tags are absent. The minimum required Twitter Card tags are `twitter:card` and `twitter:title`. If `og:title` and `og:description` are set and no `twitter:title` override is provided, Twitter will use the OG values.
What does the robots meta tag do?
`<meta name='robots'>` instructs search engine crawlers about whether to index the page (`index` or `noindex`) and whether to follow its links (`follow` or `nofollow`). Use `noindex` for private pages, thin content, or pages you don't want to appear in search results.
Is the meta description a ranking factor?
No — the meta description is not a direct ranking factor in Google's algorithm. However, it is shown as the snippet in search results and a well-written description can significantly improve click-through rates, which has an indirect effect on search performance.
What is the canonical tag and when should I use it?
The canonical tag (`<link rel='canonical' href='...'>`) tells search engines which version of a URL is the preferred one. Use it whenever the same content is accessible at multiple URLs — for example, with and without `www`, with query parameters, or through pagination.
Do meta keywords still matter for SEO?
No. Google and most major search engines have ignored the `<meta name='keywords'>` tag for over a decade due to widespread keyword stuffing abuse. There is no benefit to including it, and it can reveal your keyword strategy to competitors who inspect your source code.
Ready to use this tool?
Free, instant, no account required. Runs entirely in your browser.
More Web & HTTP Guides
HTTP Status Codes: Complete Reference Guide for Developers
6 min read
Query String Parser: Decode and Inspect URL Query Parameters
4 min read
Query String Builder: Build URL Query Strings from Key-Value Pairs
4 min read
cURL to Code Converter: Convert cURL Commands to JavaScript, Python and More
5 min read