AIWebApp

A landing page you can ship this afternoon

A landing page for a note-taking startup called Margin, with features, pricing, testimonials and an FAQ.

MarginLanding pageExample — not saved until you change it

Runs on this device in under a second. Ctrl+Enter also generates.

What the planner understood

Confidence100%
  • landingLanding page template
  • landing pageLanding page template
  • startupLanding page template
  • Marginapp name
  • pricingPricing section on the home page
  • faqFAQ section on the home page
Feasibility, templates and prompt history

Feasibility

  • NATIVELight and dark theme
  • NATIVEResponsive layout

Start from a template

Picking a template keeps the name, colours and fields from your description.

Prompt history

Off by default. Prompts are only kept in this browser if you turn this on.

index.html
Sandboxed · network off · fits 772px

Theme preset

Colours and type

Adjusted per mode if needed to keep 4.5:1 contrast.

Colour mode

Contrast check

PairLightDarkBody text17.0:1 pass15.5:1 passButton text7.9:1 pass5.2:1 passLinks7.5:1 pass5.2:1 passMuted text5.5:1 pass6.7:1 pass

WCAG AA needs 4.5:1 for normal text.

Name and copy

Also used for the page title, icon monogram and web manifest.

Restyle with tokens

Every colour, radius, spacing step and font comes from tokens.css. The Design tab edits those tokens: pick a preset, choose your brand colour, switch between system, serif, rounded and monospace stacks, and set the corner radius. Contrast is checked against WCAG AA in both light and dark modes, and colours that would fail are nudged until they pass.

Copy edits — headline, subheadline and button label — update the hero and the call-to-action together, so the page stays consistent.

Waitlist without a backend

The waitlist form validates email addresses and stores sign-ups in the visitor’s browser. To collect sign-ups centrally, connect a form service after export; the generated note says exactly that so nobody is misled.

Frequently asked questions

Can I take payments from the pricing table?

No. Pricing is display-only. Payments need a provider and a server.

Will it look good on phones?

Yes. Layouts use fluid grids and are checked at 360px, 768px and 1280px using the preview’s device sizes.