Free · Nothing uploaded · Live preview
Fill in your page details, see exactly how it'll look, copy the tags.
Google preview
https://example.com
Page title
Meta description will appear here.
Social share preview
example.com
Page title
Meta description will appear here.
Generated tags
<meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="robots" content="index, follow"> <meta name="theme-color" content="#DB2777"> <!-- Open Graph --> <meta property="og:type" content="website"> <meta property="og:locale" content="en_US"> <!-- Twitter Card --> <meta name="twitter:card" content="summary_large_image">
They control how a link looks when shared on Facebook, LinkedIn, Slack, Discord and most other platforms that generate a preview card — the title, description and image shown come from these tags rather than being guessed from the page.
They serve the same purpose for a different platform. X (Twitter) reads its own twitter:* tags first and falls back to Open Graph tags if they're missing, so it's worth setting both for a consistent preview everywhere.
Search engines and social platforms truncate text past a certain length — around 60 characters for titles and 155-160 for descriptions is the commonly cited safe range before Google starts cutting text off with an ellipsis.
Not for Google — it has publicly stated it doesn't use the keywords meta tag for ranking. It's included here mainly for completeness and because a few smaller search tools still read it.
Inside the <head> section of your page, ideally with charset and viewport as early as possible. Paste the generated block directly in after copying it.