Kage Design logo kage
plane.so
Plane Agents · OG images · Editorial · Minimal screenshot

Design analysis

A 1200×630 social card built on a full-bleed, motion-blurred landscape of dark forest greens and golden ochres, diagonal streaks sweeping from lower-left to upper-right. All content sits on a single left-weighted baseline band at roughly 55% height: a white geometric logo mark plus wordmark at left, and a two-line tagline right of center where "Work infrastructure for" is set in a light weight and "humans and agents" bolds the two key nouns. The pure-white type pops against the mid-tone organic background, and the near-symmetrical logo/tagline pair gives the card a calm, editorial feel with no UI, gradients or decoration.

Prompt preview
## Reference images

Study these alongside the description below: hierarchy, rhythm, spacing, colour. Build for the product you are asked about, using this design language.

- Screenshot: https://kage-design-assets.t3.tigrisfiles.io/screenshots/plane-agents/8d955219-e717-4163-90a1-08a67218ee47-1790143302440.webp
- Design on Kage: https://kage.design/designs/plane-agents-og-image

## Before you start
Ask the user what product the card is for, who it is for, and what brand assets they have (logo/wordmark, brand colours, typeface). Wait for the answers; everything below applies to their brand, not the reference.

## Goal
Produce a single **1200×630 Open Graph social card** image — as HTML/CSS (e.g. a fixed 1200×630 container rendered to PNG with a headless browser, Playwright screenshot, or an SVG exported to PNG). Placeholders for all branding and copy are fine.

## Page structure
1. **Full-bleed background (1200×630)**: an abstract, organic texture — a heavily motion-blurred landscape-like image or a canvas/CSS gradient composition with diagonal soft streaks (warm olive/ochre tones in the reference) flowing from lower-left to upper-right. It should read as calm texture, not a photo of anything recognisable.
2. **Content band** (a single horizontal row, vertically centred around ~50–55% height, left-aligned starting ~17% from the left):
   - Left: white logo mark (simple geometric shape) + wordmark in white, ~44px, medium weight.
   - Right of center: the tagline in two lines, white, ~52–56px, line-height ~1.2 — first line light/regular weight, second line bolding only the two key nouns (e.g. "Work infrastructure for" / "**humans** and **agents**" pattern: lead word and key noun bold, connectors regular).
3. **No footer, no URL, no UI elements, no badges.**

## Design language
- Exactly two content elements on one shared baseline; generous clear space on all edges (≥80px padding).
- Type: a clean geometric sans (e.g. Inter/Manrope-style). Hierarchy from weight contrast (400 vs 700), not size or colour — both lines the same size.
- Colour: pure white (#FFFFFF) type over mid-tone, low-contrast organic background so text stays legible without overlays; background palette warm earth/olive tones (#2f3a28 dark greens, #b98a3f–#d9b56a ochres in the reference).
- Background motion blur: diagonal direction ~15–20° upward to the right; keep the central text band relatively smooth so glyphs stay crisp.
- Slight horizontal gap (~90px) between logo lockup and tagline; keep the whole lockup optically centered-left, not dead-center.

## Never
No logos, wordmarks, product names, copy, illustrations, photography or icon sets from the reference; never present the result as that product. Use placeholder branding and copy only.

Related designs