Cursor

Why it works

Generous breathing room surrounds hero demos, letting interactive components do the persuading. A dark-to-light theme toggle that respects system preferences signals technical credibility to developers instantly. Typography hierarchy keeps dense feature lists scannable through size contrast and layered colour.

Who should look at this

Founders building developer tools or complex SaaS who need to showcase autonomous features without overwhelming non-technical visitors.

Signature technique

A live embedded code editor in the hero section lets visitors see the product working in real time — far more convincing than a static screenshot or a marketing video.

How the page is built

1. Quiet navigation bar. A small logo, four centred links, a ghost-style 'Sign in' and a dark 'Download' button sit on a warm off-white background.
2. Modest headline and one button. A two-line statement in ordinary-sized dark text is followed by a single dark button that names the visitor's own computer.
3. Product window on a painting. A large window of the app, showing a planned task in progress, sits on a soft painted landscape of mountains and a lake.
4. Grey logo tiles. A line saying who trusts it sits over eight company names in equal grey tiles, so very different logos read as one calm row.
5. Agents turn ideas into code. A short paragraph and an orange link sit on the left of a pale panel, with a second large window on the right.
6. More feature blocks. Further blocks on working autonomously, working in every tool and choosing the best model for each task repeat the same pattern of heading, paragraph and picture.
7. Changelog, research note and closing line. A list of recent updates and a note about the research team behind it show the product is actively built, ending with 'Try Cursor now.'

Look and feel

A warm cream page with dark text and almost nothing loud on it. The only richness is the soft painted landscape behind the product window, which makes the software look like a framed piece in a gallery rather than a screenshot on a gradient.

Where it might not fit

A quiet, small headline and a pale palette can feel too subdued for a lesser-known brand that needs to stand out. The product window is also dense, with tiny text, so visitors have to trust it rather than read it.

What to borrow

• Set your product window on a soft piece of artwork, such as a painting, instead of a flat colour or gradient, so a screenshot feels crafted.
• Keep the headline modest in size and let the picture be the loudest thing on the page, which signals confidence.
• Make the main button name the visitor's own computer, such as 'Download for Windows', so it answers 'is this for me?' before they click.

Brief your developer

“I want a warm off-white homepage with a modest-sized headline, one dark button that names the visitor's own computer, and a large product window sitting on a soft painted landscape, followed by a row of client logos in plain grey tiles.”

Want a full version for your own site? Get the brief.

Does a homepage need a big, bold headline?

Cursor's headline is two modest lines of plain dark text, well below the size most software sites use, while the product window and painted backdrop carry the visual weight. It signals confidence and lets the picture do the talking. That works when the product is already known or easy to grasp. A lesser-known business may still need a stronger statement.

How can logos look tidy instead of cluttered?

Cursor puts eight company names into equal-sized grey tiles under a single line of text, with no colour, so they read as one calm row. Equal tiles keep logos of very different shapes in order. If your logos come in different colours, turning them all one grey or white gets the same effect.