Meta Tag Generator

Fill in the form and get complete, production-ready HTML meta tags instantly — including title, description, canonical URL, robots directive, Open Graph, and Twitter Cards. See a live Google search preview and social card preview as you type.

Tag Settings

Page Info
Technical

Recommended: 1200 × 630 px

Title, description, and image inherit from Open Graph.

Google Search Preview

Your Website
www.example.com
Your Page Title Goes Here
Your meta description will appear here. Write 50–160 characters to describe your page and improve click-through rates from Google search results.

Social Preview (Open Graph)

Enter an OG Image URL to preview

EXAMPLE.COM
Your page title
Your page description will appear here

Generated HTML

Paste inside your page's <head> tag

meta-tags.html
<!-- Primary Meta Tags -->
<meta name="robots" content="index, follow">

Updates live as you type

About this tool

A complete meta tag generator that covers everything search engines and social networks need to display your page correctly. Fill in the form on the left — every field updates the generated code and the live previews instantly, so you can see exactly how your page will appear in Google results and when shared on Facebook, LinkedIn, or Twitter before you deploy a single line of code.

The Google search preview shows how your title and description will appear in search results with character-count validation (title: up to 60 characters, description: 50–160 characters). The social preview shows your Open Graph card with your actual image, title, and description. When you're happy with the result, copy the generated HTML to clipboard or download it as a file — then paste it into your page's <head> tag.

How to use

1

Fill in your page details

Enter your page title (50–60 chars), meta description (50–160 chars), and optional keywords and author. A colour indicator shows whether the length is ideal.

2

Add technical settings

Set your canonical URL to tell search engines the definitive version of this page. Choose a robots directive — keep 'index, follow' for all public pages.

3

Configure Open Graph and Twitter

Add an OG image URL (1200 × 630 px recommended) and site name. OG title and description inherit from your primary fields automatically if left blank.

4

Copy or download and paste

Click Copy or Download, then paste the HTML inside your page's <head> tag. In Next.js use next/head; in WordPress paste into your SEO plugin's custom HTML field.

Related tools

Word Counter

Count words and characters, estimate reading time — useful for optimising meta description length.

QR Code Generator

Encode your page URL into a scannable QR code for offline marketing materials.

JSON Formatter

Beautify and validate JSON — handy for structured data (schema.org) alongside your meta tags.

Password Generator

Generate cryptographically secure passwords for CMS admin accounts.

Frequently asked questions

Common questions about meta tags, SEO, Open Graph, and how to use the generated code.

The meta title (or title tag) is the clickable headline shown in Google search results and in the browser tab. It should be 50–60 characters long — Google typically truncates titles beyond 600px of rendered width, which is roughly 60 characters in a standard font. Keep your most important keyword near the beginning.

The meta description is the short paragraph shown below your title in search results. Google has confirmed it is not a direct ranking factor, but a well-written description improves click-through rates (CTR), which is an indirect signal. Keep it between 50 and 160 characters, include your target keyword, and make it compelling.

Open Graph (OG) tags control how your page looks when shared on Facebook, LinkedIn, WhatsApp, Slack, and other platforms. Without them, these platforms pick title, description, and image automatically — often poorly. The most important OG tags are og:title, og:description, og:image (ideally 1200 × 630 px), and og:url.

The robots meta tag tells search engine crawlers whether to index your page and follow its links. 'index, follow' (the default) is correct for most public pages. Use 'noindex' for pages like thank-you pages, login pages, or duplicate content you don't want in search results. Use 'nofollow' to stop crawlers following links on a page.

A canonical URL tag tells search engines which URL is the 'master' version of a page when the same content is accessible at multiple URLs (e.g. with and without trailing slash, with UTM parameters, or via HTTP and HTTPS). It prevents duplicate content penalties. If your site has a single clean URL for each page, set the canonical to that URL.

Twitter Card tags are Twitter's equivalent of Open Graph. In practice, Twitter falls back to OG tags if Twitter-specific tags are absent — so this generator sets Twitter title, description, and image to inherit from your OG values automatically. You only need to add a Twitter-specific tag if the content should differ on Twitter.

Paste the generated HTML inside the <head> section of every page you want to optimise. In a Next.js app, use the next/head component or the Metadata API. In WordPress, use the Yoast SEO or Rank Math plugin's 'Custom HTML' fields. In plain HTML, paste directly between <head> and </head>.