Aeon Showcase Landing
Create a realistic, award-quality full-width desktop landing page hero
section for a FICTIONAL knowledge management SaaS product called "AEON"
(explicitly a sample to demonstrate fumeng's ceiling, not a real product).
Visual style: Warm editorial, pushed to absolute Dribbble-showcase
quality. Feels hand-crafted by a senior designer at Anthropic × Notion ×
Stripe. Every pixel purposeful, every typographic choice deliberate.
Color palette (strict):
- Primary background: warm cream oklch(0.97 0.005 40) with VISIBLE paper
grain texture (not a flat fill)
- Deep warm ink: oklch(0.18 0.02 30)
- Accent terracotta: oklch(0.58 0.19 28)
- Warm gold foil (used in ONE spot): oklch(0.72 0.15 75)
- Muted warm grey: oklch(0.50 0.01 30)
- Hairline separator: oklch(0.88 0.008 40)
Typography (strict):
- Display: humanist serif (Tiempos Headline character), weight 500,
EXACT size 96px, tracking -1.5%, optical-size for display
- Body: warm editorial body serif (PP Editorial Old character), 18px,
line-height 1.7, weight 400
- UI labels / monospaced accents: IBM Plex Mono character, 13px
uppercase tracking 2%
Layout (asymmetric editorial, LEFT-aligned, 8-column text + 4-column visual):
TOP NAV (full-width, sits at the very top with 32px padding):
- Left: "AEON" wordmark in serif display 28px deep ink + a tiny
gold-foil seal-script stamp character "永" to the right at baseline
(suggesting "permanence")
- Center (spaced across): nav items in monospaced 13px uppercase:
"PRODUCT" · "PRICING" · "DOCS" · "JOURNAL" · "CAREERS"
- Right: "Sign in" text link in body-serif 14px + a small terracotta
pill button "Start writing"
HAIRLINE below nav: 1px warm-grey separator spanning full width.
HERO ROW (below hero, large whitespace breathing):
LEFT 55% (text stack):
- Eyebrow line in monospaced 13px uppercase, terracotta color:
"A QUIET PLACE FOR DELIBERATE THOUGHT"
- 32px vertical gap
- Display headline on THREE lines (EXACT TEXT, left-aligned, 96px serif):
"The last note-taking
app you will ever
adopt. Promise."
The single word "Promise." gets a delicate WARM GOLD FOIL underline
(1px thin, hand-drawn feel) — the only gold accent in the entire
composition.
- 24px vertical gap
- Subheadline in body serif 18px, TWO lines (EXACT TEXT):
"AEON is a workspace for people who write to think, not to publish.
Zero noise. Zero metrics. Zero gamification."
- 32px vertical gap
- CTA row (inline):
* Primary: terracotta pill button (36px tall, 28px horizontal
padding), white body-serif text 16px: "Start your first essay"
* 24px gap
* Secondary text link in body serif 16px deep ink with subtle
underline: "Watch a 90-second tour →"
- 48px vertical gap
- Trust line in monospaced 11px uppercase, muted warm grey:
"[REPLACE WITH REAL CUSTOMER METRIC AFTER LAUNCH]"
RIGHT 45% (hero visual):
- A realistic editorial-looking note editor mockup TILTED 8 DEGREES
clockwise. Shows two open pages side-by-side like a spread book:
* Left page: a handwritten-feeling essay titled "On the weight of
empty calendar days" in serif, with a small sketch/doodle in the
margin
* Right page: continuing body text in warm serif with marginalia
annotations in smaller italic
- A subtle dark drop shadow beneath the editor suggests physical weight
- Small UI chrome at the top of the editor showing tabs:
"ESSAYS / FIELD NOTES / QUESTIONS" in tiny mono caps
BELOW HERO ROW (full-width, 96px below):
Trust bar row — SIX MONOCHROME ABSTRACT GEOMETRIC MARKS at 45% opacity,
evenly spaced across the full width:
- circle · hexagon · square · triangle · plus · chevron
- Each has a tiny monospaced 10px label below: "[placeholder]"
Below the trust bar, a thin 1px terracotta rule spans the full width.
BACKGROUND TREATMENT:
- Warm cream paper base with visible handmade grain (not a flat fill)
- EXTREMELY faint ink-wash cherry-blossom silhouettes at 2% opacity in
the top-right and bottom-left corners ONLY — suggesting seasons,
not decoration
- A single very subtle gold-foil dot pattern running along the bottom
margin at 4% opacity (40 dots across the full width, 2px each)
Use case: The flagship "this is what fumeng can produce" showcase image
for the README, 2560x1440 resolution.
STRICT CONSTRAINTS:
- NO Inter, Roboto, Arial, Space Grotesk, Fraunces, system-ui, Poppins,
Montserrat, DM Sans, Work Sans, Nunito anywhere.
- NO purple-pink gradients, NO tech-blue gradients, NO holographic,
NO glass morphism.
- NO 3-column symmetric feature grid below hero (we have NO features
section in this crop).
- NO emoji anywhere.
- Trust bar MUST be abstract geometric marks, NOT fabricated company
logos. Trust line MUST be a placeholder, NOT a made-up metric.
- All copy inside the design must be EXACTLY as specified above —
do not hallucinate alternative headlines or labels.
- Pixel-perfect 8px grid alignment. Letterpress restraint.
- Every decorative element must earn its place. If an element does not
carry meaning, it does not appear.
- Feel must be editorial, human, contemplative — NOT tech-marketing,
NOT corporate, NOT slick-SaaS.when to use it
Community prompt sourced from the open-source GitHub repo qiuxinyuan321/fumeng (MIT). A "Aeon Showcase Landing" style prompt — adapt the placeholders and specifics to your task. Imported as-is and not independently retested here, so check the output before relying on it.
tags
marketingcommunitygeneral
source
qiuxinyuan321/fumeng · MIT
more in Marketing
Marketing✓ tested
Landing page hero, three angles, zero hype
conversion copywriter who writes plainly and specifically
Marketing✓ tested
Cold email that earns a reply
founder who writes short, specific, non-salesy outreach
Marketing
Turn one long post into a week of content
content strategist who repurposes without diluting