Open Graph Generator

Title

Description

Page URL

Image URL

Site name

Content type

Twitter card type

Result

The tags<meta property="og:type" content="website"> <meta property="og:title" content="Калькулятор процентов онлайн"> <meta property="og:description" content="Шесть режимов расчёта процентов без регистрации."> <meta property="og:url" content="https://example.com/percent"> <meta property="og:image" content="https://example.com/og.png"> <meta property="og:site_name" content="UniTools"> <meta name="twitter:card" content="summary_large_image"> <meta name="twitter:title" content="Калькулятор процентов онлайн"> <meta name="twitter:description" content="Шесть режимов расчёта процентов без регистрации."> <meta name="twitter:image" content="https://example.com/og.png">
Tags10
Title lengthThe title length is fine for a preview.
About the imageA 1200 × 630 image suits both Open Graph and Twitter.
Title characters28
Description characters48

How your link looks in someone else's feed

Builds Open Graph and Twitter Card meta tags so a link unfurls with a picture and a description wherever it is shared.

Open Graph was invented at Facebook and picked up by everyone: Telegram, LinkedIn, Slack and the rest read the same tags. Without them a link is a bare URL; with them it becomes a card with a title, a description and an image.

Twitter added its own set but falls back to Open Graph when they are missing. Duplicating is worth it for one tag in particular — twitter:card, which picks between a small image and a large one.

What this calculator shows

A ready block of Open Graph and Twitter Card tags
Title and description length with a truncation warning
Guidance on the image size

What to keep in mind

URLs in og:url and og:image must be absolute: relative paths do not unfurl.
Social networks cache previews for a long time, so after editing tags you have to force a refresh through each platform's debugger.

FAQs

What size should og:image be?

1200 × 630 pixels, a 1.91:1 ratio. The minimum is 600 × 315, below which some platforms show a small icon instead of a banner.

Do I need separate Twitter tags?

Only twitter:card; the rest falls back to Open Graph. Duplicating the title and description explicitly does insure against surprises.

Why does the preview not update?

Social networks cache the card. Each platform has a debugger that forces a re-read and refreshes the cache.

Does Open Graph affect SEO?

Not ranking. It does affect clicks from social and messaging apps considerably: a link with an image earns far more of them than a bare URL.

Worked example

A tool page

Input: Title, description, URL, image and site name

Output: Ten tags: six Open Graph and four Twitter

Note: A 1200 × 630 image suits both: Telegram shows it whole and Twitter does too with summary_large_image. Anything smaller gets cropped from the centre.

Useful links

All tools in Dev Tools

Open Graph Generator

Result

Related tools

Meta Tag Length Checker

JSON-LD FAQ Generator

Robots.txt Generator

Useful links