Layouts
Layouts decide where the main pieces of your image sit. Each one has a different set of slots and works best for a different kind of message.
Classic
A balanced announcement layout with a centred title, supporting tagline, and a metric or short detail near the bottom.
Use Classic for launch announcements, funding news, reports, and general company pages. It gives the headline the most attention without feeling sparse.
Slots: Title, Tagline, Metric.
Split
Text sits on the left while a strong accent panel fills the right side. Useful when you want more visual contrast.
Use Split for product launches, changelogs, and feature announcements. Keep the title fairly short so it does not crowd the left column.
Slots: Eyebrow, Title, Tagline.
Minimal
A quiet, centred layout with generous space and only the essential message.
Use Minimal for personal sites, portfolios, essays, and brands that do not need a metric or busy supporting copy.
Slots: Title, Tagline.
Metric
A large number takes centre stage, with a label and company name underneath.
Use Metric for MRR, user counts, waitlist totals, GitHub stars, uptime, or any number worth making the headline.
Slots: Stat, Label, Company.
Announcement
Logo fixed top-right. Eyebrow in a small accent-coloured pill top-left. Large bold title below, left-aligned. Tagline muted below the title. Strong left composition with breathing room on the right.
Use Announcement for new feature releases, product updates, and version announcements. The eyebrow pill gives readers instant context before they reach the headline.
Slots: Eyebrow, Title, Tagline.
Blog Post
A full-height accent colour stripe runs down the left edge. Logo top-right. Large title dominates the top half. Tagline sits bottom-left like a byline.
Use Blog Post for articles, newsletters, and essays. The left stripe signals editorial content at a glance. Keep the tagline short — treat it like a byline, not a summary.
Slots: Title, Tagline.
Dark
Identical composition to Classic — centred title, tagline, and metric bar — but with a forced dark (#1C1C1E) background regardless of your brand background setting. All text is white.
Use Dark for brands that live in dark mode, premium tech products, or any time you want a more striking, high-contrast image. The accent colour still applies to the metric bar. Brand background colour is ignored by this layout.
Slots: Title, Tagline, Metric.
Bold Type
No logo. No metric. No tagline. The title fills the canvas, centred horizontally and vertically, at the largest size your font size setting allows.
Use Bold Type for quotes, opinions, bold statements, and single-message pages where the words are the whole point. Pair with a strong font like Bebas Neue, Unbounded, or Fraunces for maximum impact.
Slots: Title.
Split Bottom
Top 62% uses the brand background with your logo and title. Bottom 38% is a full-width band in the accent colour with the metric on the left and tagline on the right.
Use Split Bottom for SaaS landing pages and metrics-forward announcements where you want the number to hit hard. The accent band auto-detects whether to use white or dark text based on your accent colour. Keep the metric short — two or three words at most.
Slots: Title, Tagline, Metric.
Sidebar
A 24-pixel accent colour stripe runs the full height on the left edge. All text — eyebrow, title, and tagline — sits in the remaining canvas space, left-aligned. Logo top-right.
Use Sidebar for corporate pages, case studies, formal announcements, and agency sites where structure and discipline read as quality. The eyebrow works well for category labels like "Case Study", "Report", or "Whitepaper".
Slots: Eyebrow, Title, Tagline.
Switching layouts
You can change the layout from the editor's Layout tab. The slot set changes with the layout, so copy any text you want to keep before switching.
Image size
Every layout renders at 1200 × 630 pixels, the standard Open Graph image ratio. Opengraphly scales the editor preview to fit your screen, but the final image is rendered at full size.