SEO

Meta Tag Generator

LOCAL · Browser-Only

Generate SEO meta tags, Open Graph, Twitter Card, JSON-LD structured data, and robots directives

Basic Meta Tags

Page Title0/60

Meta Description0/160

Keywords (comma-separated)

Author

Social / Open Graph

Canonical URL

OG Image URL

Site Name

Twitter Handle

Google Search Preview

Page Title

https://example.com

Your meta description will appear here. Write a compelling summary to encourage clicks from search results.

Generated HTML

<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="robots" content="index, follow">

<!-- Open Graph / Facebook -->
<meta property="og:type" content="website">

<!-- Twitter Card -->
<meta name="twitter:card" content="summary">

Social Card Preview

Twitter / X

No image set

example.com

Page Title

Your description will appear here.

Facebook

No image set

example.com

Page Title

Your description will appear here.

No image set

Page Title

example.com

·Share recipe

Was this tool helpful?

What is Meta Tag Generator?

Free online meta tag generator to create complete, SEO-optimized HTML meta tags for your web pages.

Fill in your page title, description, keywords, and social details, then get ready-to-use HTML including standard SEO meta tags, Open Graph tags for Facebook and LinkedIn, and Twitter Card markup. See a live preview of how the page will look as a Google search result and as a social share card before you ship it. Use it as an Open Graph generator, a Twitter Card generator, or a one-stop social media meta tag creator. Copy the generated HTML and paste it into your page's <head> section. No signup required.

How to Use Meta Tag Generator

1Fill in the basic fields: page title, description, keywords, and author
2Add Open Graph details: OG title, description, image URL, and site name
3Add Twitter Card details: card type, title, description, and image URL
4Preview how your page looks in Google search results and copy the generated HTML

Frequently Asked Questions

What are meta tags and why are they important for SEO?

Meta tags are HTML elements in your page's <head> section that provide metadata about the page. Search engines use the title tag and meta description to display your page in search results. Well-crafted meta tags improve click-through rates from search results and help search engines understand your content.

What are Open Graph tags?

Open Graph (OG) tags control how your page appears when shared on Facebook, LinkedIn, and other social platforms. They define the title, description, image, and URL that appear in the social share preview. Without OG tags, platforms will try to auto-generate a preview that may not look ideal.

What is the ideal length for a meta title and description?

Meta titles should be 50-60 characters to avoid being truncated in Google search results. Meta descriptions should be 150-160 characters. Both should include your target keyword naturally and be compelling enough to encourage clicks.

How do I add meta tags to my website?

Copy the generated HTML code and paste it inside the <head> section of your HTML page, before the closing </head> tag. If you use a CMS like WordPress, you can use an SEO plugin to set these values through a user interface.

What size should my Open Graph image be?

Use a 1200 by 630 pixel image for the og:image tag. That ratio displays as a large card on Facebook, LinkedIn, and X without cropping. Keep the file accessible at a public URL so the platforms can fetch it when your link is shared.

What is the difference between Open Graph and Twitter Card tags?

Open Graph tags (og:title, og:description, og:image) control previews on Facebook, LinkedIn, and most platforms. Twitter Card tags (twitter:card, twitter:title) control the preview on X. Many platforms fall back to Open Graph, but including both gives you the most control over how the link looks everywhere.

Share this tool

Related Tools

Og tag tester

Free online open graph preview - preview how your page looks when shared on social media platforms

SEO

SEO Analyzer

Free online SEO analyzer - analyze any website's SEO score and get actionable improvement tips

🌍

Hreflang generator

Generate hreflang tags for multilingual SEO - HTML, HTTP headers, and XML sitemap formats

ico

Favicon Generator

Free online favicon generator - generate favicons from text, emoji, or uploaded images in all required sizes

CSS

Glassmorphism generator

Free online AI CSS generator - browse 25+ CSS effects or generate custom styles with AI

Professional email signature

Free online email signature generator - create professional HTML email signatures with live preview

🤖

Robots.txt Generator

Free online robots.txt generator - generate robots.txt files to control search engine crawler access

🍪

Cookie banner generator

Free online cookie consent generator - generate cookie consent banners and compliance code

Keep reading: HTML Cheat Sheet and hash algorithms reference. Doing this in code instead? See the tool chain endpoints.

Google Search Preview

Page Title

https://example.com

Your meta description will appear here. Write a compelling summary to encourage clicks from search results.

Generated HTML

What is Meta Tag Generator?

Free online meta tag generator to create complete, SEO-optimized HTML meta tags for your web pages.