Open Graph Social Card Image Generator
Гид
Open Graph Social Card Image Generator
Design pixel-perfect social share images for Open Graph, Twitter Cards, LinkedIn, and Facebook directly in your browser. Type your title, description, and site name, pick a layout and theme, then download a PNG, JPG, or WebP at the exact dimensions each platform expects — no design tool or upload required.
Как использовать
- Pick a preset (1200×630 for Open Graph, 1024×512 for Twitter) or set custom width and height.
- Type the title, description, and site name you want on the card.
- Choose a layout (centered, left-aligned, or top-bar accent) and a theme (light, dark, brand color, or gradient).
- Tweak typography — font family, title size, and description size — to match your brand.
- Нажмите Скачать and save the PNG, JPG, or WebP for use as your
og:imageилиtwitter:image.
Возможности
- Correct social dimensions – Presets for Open Graph (1200×630), Twitter Card (1024×512), LinkedIn, and Facebook.
- Multiple layouts – Centered, left-aligned, and top-bar accent templates for different brand looks.
- Light, dark, brand, and gradient themes – Switch backgrounds in one click or use your own brand color.
- Auto-shrinking title – Long headlines wrap and resize so your card stays readable.
- Live canvas preview – Every change re-renders instantly on a real HTML5 canvas — what you see is what you download.
- PNG, JPG, and WebP export – Pick the format that fits your hosting and CDN.
- Работает полностью в браузере – No upload, no account, no watermark.
Часто задаваемые вопросы
-
What is the Open Graph protocol?
Open Graph is a set of
<meta>tags introduced by Facebook that lets a web page describe itself to social platforms. The most common tags areog:title,og:descriptionиog:image. When someone shares a link, the platform reads these tags and renders a rich card instead of a plain URL. -
What image size should an og:image be?
The Open Graph specification recommends an aspect ratio of 1.91:1 with a minimum of 600×315 pixels. Most platforms render best at 1200×630, which keeps the card sharp on retina displays while staying under the 8 MB Facebook size limit. Twitter Cards typically use 1024×512 for the summary_large_image format.
-
Why do social platforms cache og:image URLs?
Platforms like Facebook, LinkedIn, and Slack fetch the og:image once and store it on their CDN to avoid hammering your origin every time the link is shared. That cache can persist for days or weeks. To force a refresh after updating an image, change the file URL or use the platform debugger (for example, the Facebook Sharing Debugger) to scrape the page again.
-
What is the difference between og:image and twitter:image?
og:imageis part of the Open Graph protocol and is read by Facebook, LinkedIn, Slack, Discord, and most messaging apps.twitter:imagebelongs to Twitter Cards and is read by X (Twitter). If onlyog:imageis present, X will fall back to it, so a single high-quality image often works for both — but providing both lets you optimize sizing for each platform. -
Why does the title shrink automatically when it gets long?
Social cards have a fixed canvas, so a long headline that runs off the edge looks broken. The HTML5 Canvas API does not wrap text by itself, so the generator measures each word with
ctx.measureText(), breaks the headline into lines, and reduces the font size in steps until the title fits within the safe area. This keeps every export legible without manual tweaking.
Установите наши расширения
Добавьте инструменты ввода-вывода в свой любимый браузер для мгновенного доступа и более быстрого поиска
恵 Табло результатов прибыло!
Табло результатов — это интересный способ следить за вашими играми, все данные хранятся в вашем браузере. Скоро появятся новые функции!
Подписаться на новости
все Новые поступления
всеОбновлять: Наш последний инструмент was added on Май 11, 2026
