Photography
Launch a Studio With One Hero Shot
The debut card is a single photograph with the studio name set in the corner — nothing else earns the space.
Typographic OG Cards with AI
Full-bleed photography, a soft dark gradient rising from the base, and a max-weight white headline — the most universally readable direction across platforms and themes.
Text overlay · Oginify1200 × 630 · og:image
Why Choose Oginify
Text overlay is the most universally readable Open Graph language, and it's a different tool from cinematic colour-grading even though both start with a photograph. Below: the moves that define text overlay, the brands shipping it well, and when to reach for cinematic instead.
Signature Characteristics
Full-bleed editorial photograph at 1200×630, a bottom-to-top dark gradient mask (rgba 0/0/0 0→0.55) anchored to the lower third, max-weight sans-serif headline in pure white sitting on that mask, a small monospace eyebrow line above, optional 24px logo lockup in the lower-right. One headline, one photo, one gradient — never two.
Who Actually Ships It
Vercel runs the cleanest version — dark night photo + giant white wordmark. Linear's marketing pages use text overlay on every changelog. Stripe's product pages anchor the same recipe. Notion uses it on case studies. Figma's Config recap pages live in this language.
Vs Cinematic
Same skeleton — photo plus white type — but text overlay leaves the photo unmodified and lets the gradient mask carry the legibility, while cinematic re-grades the entire photo (teal-orange split-tone, crushed blacks, halftone grain) and treats it as the protagonist. Pick text overlay when the photo is the proof; pick cinematic when the mood is the proof.
Launch · v3 is live
For Product Launches
A launch link wins on the first scroll only if the photo says "new thing exists" before the headline finishes loading. Text overlay anchors a product photo edge-to-edge, drops a soft gradient over the lower third, and stacks a max-weight "v3 IS LIVE" — the card reads as evidence first, copy second.
Manifesto · the case for
For Manifestos & Narrative Essays
Long-form essays earn the click when the share card promises a point of view, not a topic. Text overlay over a single, slightly cinematic photograph — sky, hands, an empty office — gives a 4-word manifesto headline the gravity of a magazine cover.
Changelog · shipped this week
For Changelogs & Release Notes
Engineers scan changelog cards in feeds. A product screenshot photographed on a real desk, dimmed by the gradient, and topped with a monospace eyebrow + bold version headline reads as a credible release page in a single glance — far more trustworthy than a synthetic 3D render.
Portfolio · selected work
For Portfolios & Case Studies
Independent designers and studios live or die on share previews. Text overlay over a single hero shot of the work — installation, screen, object — plus a 2-word headline lets the work itself do the persuading. The card is a contact sheet, not a sales asset.
Where a Text-Overlay Card Frames the Image
One photograph, one bold caption — the treatment lets the visual do the work while the headline earns the click.
Long read
Wrap the Essay in a Cinematic Still
Longreads read differently when the card frames them as film stills — headline in a serif, photo in full bleed.
Client feature
Debut a Client Case Under One Photograph
Agencies with photography-forward casework ship case URLs under one dominant image with the headline layered clean.
Series
Number a Weekly Photo Series
Every entry in a weekly photo series becomes its own text-overlay card — the numbering does the branding.
How to Design a Text-Overlay OG Card
Text-overlay cards put the H1 straight on a photograph — the discipline is contrast management, safe-area cropping and never centering the type.
- Step 1
Darken with a gradient scrim
Add a linear scrim from 0-70% opacity black behind the type area; the scrim is what keeps the H1 legible against varied photography.
- Step 2
Cast type to the safe corner
H1 in the lower-left or upper-left third only; centered text on photography reads as stock, not editorial.
- Step 3
Test contrast against every photo
Automate a WCAG AA check between chosen text color and the underlying scrim pixels; any photo that fails needs a different image, not lighter type.
Explore Other Visual Styles
BrutalistSwiss minimalMagazine editorialTerminal / CLINeo-brutalistCinematicCollageRisograph
Frequently Asked Questions
The universal OG language: cinematic photo, bold white type, dark gradient mask.
What is a text-overlay Open Graph card style?
The most universal OG language: one full-bleed photograph, a dark gradient mask (usually bottom-to-top or radial from lower-left), and bold white display type overlaid on top. The Vercel, Linear, Stripe post-2022 pattern. Works across every industry because the photo carries the mood and the type carries the message.
When should a brand use text-overlay for OG cards?
Almost always — text-overlay is the safe universal default when no other style fits obviously. It works for SaaS, e-commerce, editorial, dev tools, agencies and consumer. The only case to skip text-overlay: when the brand is committed to a specific opinion (brutalist, terminal, collage) that makes 'universal' feel generic.
Which brands ship text-overlay OG cards in production?
Vercel, Linear, Stripe, Notion, Figma, Airbnb (feature pages), most modern SaaS launched since 2022. The pattern is so ubiquitous that seeing a brand NOT use it is more notable than seeing them do. Search any category leader's og:image and you'll find a variant.
Does the gradient mask style vary or is it always bottom-to-top dark?
Varies. Bottom-to-top dark (Vercel default) is the most common because it keeps top-of-card space clean for a logo. Radial from lower-left (Stripe pattern) works when the type sits center-left. Full-image scrim (Airbnb) works for hero-heavy compositions. All three are text-overlay variants.
How does text-overlay compare to cinematic for photo-forward cards?
Text-overlay is universal (works for any brand). Cinematic is opinionated (specific color grade, specific grain, specific mood — teal-orange split-tone, halftone). Cinematic is a subset of text-overlay with strong aesthetic commitments; text-overlay without them is the safe default.
What photograph works best as the base image?
A hero photo with a clear focal point on one side (leaves the opposite side clean for type overlay), medium-to-low visual complexity (busy photos fight the type), and enough tonal range for the gradient mask to sit naturally. Product photos in white studio backgrounds don't work; lifestyle photography does.
One URL. Four Text-Overlay Cards.
Paste any page URL and Oginify generates four 1200×630 text-overlay cards in seconds — full-bleed photo, dark gradient mask, max-weight white headline. A/B-ready, no signup.