Typeform — Conversational Form

Use in a session

Tell Claude: build [my thing] using swipe ref typeform

Full recreation prompt

Recreate a landing page in the "Typeform — Conversational Form" style (Conversational Form). This is a VIBE / STYLE-TRANSFER task, not a clone: apply the design DNA below to MY content and section structure, do not copy the reference's copy or exact layout. For this archetype the LAYOUT field carries the funnel/quiz FLOW — preserve that conversion structure, not just the look.

Design DNA:
- Mood: Human, calm, and premium. A form that behaves like a friendly one-on-one conversation instead of a wall of fields. Reduces friction by only ever showing one thing to answer.
- Colors: Deep plum / near-black canvas, warm off-white type, a single confident accent (coral or the brand hue) on buttons and choice-cards. High contrast, very few colors.
- Typography: Large elegant serif for the question prompt (the hero of every screen), clean sans for helper text, choice labels, and letter keys. One big question fills the viewport.
- Layout: FLOW-FIRST. One question per full screen, advanced by Enter or click. Thin progress bar pinned top. Each step: big serif question, optional helper line, then the input (short text, or A/B/C multiple-choice cards with keyboard letters, or rating, or email). Persistent OK ✓ + press-Enter cue. Ends on a submit/thank-you screen. Marketing homepage stacks the hero claim over three labelled product cards (Ask / Act / Learn).
- Motion: Vertical slide-and-fade between questions (old scrolls up, next rises in), gentle focus states, a progress bar that fills as you advance, subtle button-press feedback.
- Texture: Flat premium darkness — soft plum gradient, rounded choice-cards with hairline borders, generous whitespace, no clutter, no imagery competing with the question.
- Avoid: No multi-field forms crammed on one screen, no tiny labels, no busy backgrounds, no more than one accent color, no progress hidden from the user. Never show two questions at once.

Imagery (generate real assets, do not use placeholders): Generate: full-screen single-question form frames (short-text, A/B/C multiple-choice cards with letter keys, rating, email capture), a thin top progress bar, an 'OK ✓ press Enter ↵' affordance, and a soft plum-to-charcoal gradient canvas. Tool: build the form UI in code (mostly type + inputs); kie-ai Flux for any abstract plum gradient/backdrop textures.

Reference exemplar: https://www.typeform.com. Build the funnel around the content I give you next, faithfully channeling this aesthetic and this flow, and generate the matching imagery described above.

Reference exemplar