Landing page

gen_landing · slug landing-page · icon 🚀 · outputs react-app

A complete, responsive React + TypeScript landing page: hero, features, pricing, FAQ and a call to action. A copywriter writes the words, a designer sets the system, an engineer builds a single-file app you can preview and download.

Inputs

Field	Type	Notes
Product name	string	required, 1-60 chars
One-line promise	string	required, 8-160 chars — becomes the hero
Audience	string	optional
Features	text	one per line, 3-6, benefits beat specs
Pricing	text	one tier per line as “Name: price - what is included”; blank = single free CTA
Primary call to action	string	default “Get early access”
Look and feel	pick	Minimal and calm · Bold and playful · Editorial and serif · Technical and precise · Warm and organic
Primary colour	string	hex, default #6C5CE7 — everything else is derived from it
Dark theme	boolean	default true

Pipeline

Step	Role	Skills	Tier	Depends on
copy	copywriter	llm.generate	cheap	—
design	designer	llm.generate	cheap	copy
build	engineer	code.scaffold_react_node, files.write, files.read, files.list	standard	copy, design
review	reviewer	files.list, files.read, files.write	cheap	build

build is where code.scaffold_react_node actually writes and (best-effort) builds the app, so its previewUrl shows up in Outputs once the run finishes. review reads the built files back and fixes anything the reviewer flags before the project is marked done — a second pass over the same react-app output kind, not a separate deliverable.

Example run

{
  "generatorId": "gen_landing",
  "inputs": {
    "productName": "Driftwood",
    "oneLiner": "Plan your week in the time it takes to make coffee.",
    "features": "Drag a task, it reschedules the rest\nWorks offline\nShares a read-only week with clients",
    "vibe": "Minimal and calm"
  }
}