Generate <head> meta tags
Build a complete head meta-tag package — title, description, canonical, theme color, robots — ready to drop into any page. Runs in your browser.
<meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>My Awesome Page</title> <meta name="description" content="A concise 1-2 sentence summary of the page."> <meta name="robots" content="index, follow"> <link rel="canonical" href="https://example.com/page"> <meta http-equiv="content-language" content="en"> <meta name="theme-color" content="#000000">
How to build a head meta-tag pack
Fill the basic fields, tweak robots and theme, and drop the result into your HTML head. Search engines and social embeds will read these tags.
- 01
Title and description
Fill the
<title>and<meta name="description">first — search engines and most social embeds use these as the primary headline and snippet. Aim for ≤60 characters on the title and ≤160 on the description to avoid truncation in Google’s SERP.Title and description are the only fields that affect every downstream consumer: Bing, Google, DuckDuckGo, link unfurlers in Slack and iMessage, and most RSS readers all read them.
HTML <title><meta description>SERP snippet≤60 / ≤160SEOinput · title field15 / 60 charsMy Awesome Page
within budgetGoogle SERP - 02
Charset, viewport, canonical
The tool always emits
<meta charset="UTF-8">and a sensible<meta name="viewport">first — required for correct rendering on every modern browser and for passing Lighthouse audits.Set the canonical URL to the primary location of this content. Crawlers consolidate ranking signals on the canonical, so duplicate query-string or pagination variants stop diluting authority.
charset UTF-8meta viewportrel=canonicalLighthouseindexinghead · canonical linkrel · canonical<link rel="canonical">
1 tag · liveGoogle indexing - 03
Robots directive
Default
index, followkeeps the page in search results. Switch tonoindex, nofollowfor staging, thank-you pages, internal search results, or user-generated profile pages you don’t want indexed.Pair with
<meta name="theme-color">to tint the mobile browser chrome andhttp-equiv="content-language"for accurate locale detection by screen readers and translators.robotsnoindextheme-colorcontent-languageaccessibilitydirective · robotsindexindex, follow
live · 1 directiveindexable - 04
Copy into <head>
Hit Copy tags to grab the full block and paste it inside your document
<head>. Order matters slightly: charset must come within the first 1024 bytes, so keep it at the top.For Open Graph and Twitter Card tags, jump to the Open Graph Generator or Twitter Card Generator — they extend the same head with social-specific properties.
clipboard<head>Open GraphTwitter Cardprivacy-firstexport · clipboardhead · readyCopied
ready to ship0 outbound
Web-spec details that bite later
Idempotency saves retries
POST/PUT/DELETE should be safely retried. Use idempotency keys and return the same response on duplicate requests.
Match RFC 9110 status codes
Don’t invent codes. 422 for validation errors, 409 for conflicts, 429 for rate limits. Standard codes work with off-the-shelf clients.
Set <code>Cache-Control</code> deliberately
Default browser caching is conservative. Use max-age + stale-while-revalidate for hot endpoints.
Validate Open Graph in dev
OG tags break silently. Use a previewer like OG Generator + Facebook’s debugger before launch.
CORS is a server concern
The browser sends the preflight; the server decides. Wildcard origins disable credentials — be explicit.
MIME drives behaviour
Servers must send the right Content-Type. Browsers sniff but the spec says they shouldn’t — be explicit to avoid surprises.
When to generate meta tags
SEO, theming, social embeds, accessibility.
SEO basics
Title + description drive search snippets. Bundled from IANA registries at build time — no live network call, no rate limit, no leaked queries. The MIME, TLD, and status-code tables are baked in so the tool works offline once loaded.
spec-compliantBrand theming
theme-color paints the mobile browser chrome. Output is canonical per the relevant RFC (9110 for HTTP, 5322 for headers, 3986 for URLs), so spec-compliant parsers accept it as-is. Cross-browser and cross-library behaviour stays consistent.
offlineLang attribute
Improve accessibility for screen readers. Pairs with the curl-to-fetch converter for end-to-end test stubs — copy the curl from DevTools, paste, get an idiomatic fetch() body. Drop into Playwright/Vitest fixtures without manual translation.
a11yCanonical fix
Consolidate signal across duplicate pages. Catches common pitfalls (uppercase header names, smart quotes inside Content-Type, missing ;charset=utf-8) before they bite production. Validation flags rather than auto-corrects so you stay in control.
RFC-alignedStaging blocks
noindex keeps staging out of search results. Validation runs as you type — copy only when the output is shaped correctly. The output drops directly into nginx, Apache, or CDN configs without re-formatting or re-quoting.
production-gradeStatic export
Inject into your static site generator templates. Same input plus same options always produces identical canonical output, so the tool is safe to embed in CI scripts that diff against expected configs.
curl-readyFrequently asked questions
Something missing?
Tell us what you need. We ship the top requests every two weeks.