A gallery of real websites

Real websites, studied closely.

Fifty live sites in five types, each with a full screenshot of its first screen and a short note on what it does well. No templates, no paid placements: just good design you can learn from, and a blog that explains how it works.

SaaS

Software homepages that explain an abstract product in one screen.

Linear

Linear opens on a near-black canvas with a single line of large Inter type: “The product development system for teams and agents.” Below it sits a real slice of the product, not an illustration of it.

Stripe

Stripe still owns the flowing gradient that half the industry copied.

Notion

Notion pairs a very large headline, close to 90px, with small hand-drawn sketches and a highlighted word inside the sentence.

Vercel

Vercel’s homepage is almost entirely black and white: a two-word headline, “Agentic Infrastructure,” set in Geist, and the brand triangle as the only graphic.

See all ten SaaS sites

Portfolio

Personal sites where the site itself is part of the work.

Jens Bosman

A videographer’s site built on giant white capitals over black, with black blocks cutting through the words like edit marks.

Clay Boan

Clay Boan puts a huge blackletter “CLAY” in the middle of a black screen and keeps everything else tiny.

Eduard Bodak

A designer and developer from Cologne with a simple promise: “Crafting Websites that Feel Good.” Cream background, one pink mark and a large centred headline.

Clément Grellier

The name runs across the full width as a single word, “CLEMENTGRELLIER,” at more than 110px.

See all ten Portfolio sites

Ecommerce

Stores that make you want the product before you scroll.

Patagonia

Patagonia leads with one product category, “Fleece,” over a candid outdoor photo, with simple pill buttons for Women’s, Men’s and Kids’.

Allbirds

A warm grey background, the Geograph typeface and a street photo of the shoes in use.

Away

Away uses a single macro photograph of a suitcase detail with the line “The best, made better.” in capitals.

Ooni

Ooni puts the offer front and centre, “Price Drop,” over a pizza oven in action, then follows with a row of trust signals about shipping, returns and guarantees.

See all ten Ecommerce sites

Magazine and Blog

Publications that make reading a pleasure, on any screen.

Hunger

Hunger is a fashion and culture title that keeps the homepage simple: a large cover star on the left, smaller stories on the right, and a light grey background.

WIRED

WIRED uses a dense, multi-column news layout with a strong lead story in the centre and narrow columns of headlines on each side.

The New Yorker

The New Yorker carries its print identity onto the web almost untouched: its Caslon typeface, plenty of white space and a lead story built around a photograph and a pull quote.

Exhibition Magazine

The masthead runs edge to edge in tall condensed capitals over a full-bleed fashion photograph.

See all ten Magazine and Blog sites

Landing Page

Pages built for a single action, most of them the destination of an ad.

Airbnb: Host Your Home

Airbnb turns the landing page into a calculator: a big estimated earnings figure, a slider for nights per month and a map of the local market.

Semrush: Traffic Analytics

A centred headline, “Analyze your competitors’ website traffic,” a domain input and a “Try free for 7 days” button.

See all ten landing pages

Guides

The gallery shows what good design looks like. The guides explain why it works and how to do the same on your own site, one topic at a time.

Chosen by hand

Every site here was picked and annotated by Dan Strand, who built websites for clients for years before he started making themes and tools of his own. Nobody pays to appear in the gallery, and every note says what is worth borrowing, not just what looks nice.

About HTML Inspiration