01
Eight Sleep homepage
Design by Eight Sleep, eightsleep.com
- Dark block #101315 covers 25 percent of the page, with #386D99 as the accent.
- Headings in Neue Montreal at weight 500, 200 px.
- Spacing on a 4 px base unit.
Best landing pages, picked and broken down
The best landing pages make one promise, show the product next to it and ask for one action. These are the 20 highest rated landing pages in our library, each credited, linked to its source and broken down into palette, type and spacing.
- Light canvas
- 60%
- One type family
- 45%
- 4 px grid
- 70%
-
-
02
Ramp homepage
Design by Ramp, ramp.com
- Light canvas #FEFEFE covers 91 percent of the page, with #E2EE2E as the accent.
- Headings in Lausanne at weight 400, 64 px.
- Spacing on a 4 px base unit.
-
03
Loops homepage
Design by Loops, loops.so
- Light canvas #FBFAFA covers 93 percent of the page, with #F75A07 as the accent.
- Headings in Newsreader at weight 500, 44 px, body in Inter.
- Spacing on a 2 px base unit, sections about 200 px apart.
-
04
Oura homepage
Design by Oura, ouraring.com
- Light canvas #F5EDE4 covers 76 percent of the page, with #9E603F as the accent.
- Headings in Editorial New at weight 300, 80 px, body in Akkurat.
- Spacing on a 8 px base unit, sections about 80 px apart.
-
05
Cursor homepage
Design by Anysphere, cursor.com
- Light canvas #F4F4F2 covers 86 percent of the page.
- Headings in CursorGothic at weight 400, 26 px.
- Spacing on a 2 px base unit, sections about 67 px apart.
-
06
Pitch homepage
Design by Pitch, pitch.com
- Light canvas #FEFDFE covers 62 percent of the page, with #CEBAF8 as the accent.
- Headings in Mark Pro Bold at weight 700, 180 px, body in Eina 03.
- Spacing on a 4 px base unit, sections about 80 px apart.
Want landing pages in one exact style? Describe it in plain words and get the matches.
Search designs -
07
charity water homepage
Design by charity: water, charitywater.org
- Light canvas #F9F4E6 covers 39 percent of the page, with #158596 as the accent.
- Headings in Kazimir Text at weight 400, 46 px, body in Proxima Nova.
- Spacing on a 8 px base unit.
-
08
Framer homepage
Design by Framer, framer.com
- Dark canvas #030404 covers 85 percent of the page, with #908ADD as the accent.
- Headings in GT Walsheim Medium at weight 500, 54 px, body in Inter.
- Spacing on a 5 px base unit, sections about 100 px apart.
-
09
Attio homepage
Design by Attio, attio.com
- Light canvas #FCFCFC covers 90 percent of the page.
- Headings in Inter at weight 600, 64 px.
- Spacing on a 2 px base unit.
-
10
Resend homepage
Design by Resend, resend.com
- Dark canvas #030303 covers 96 percent of the page.
- Headings in Domaine at weight 400, 96 px, body in Inter.
- Spacing on a 4 px base unit, sections about 96 px apart.
-
11
1Password homepage
Design by 1Password, 1password.com
- Dark canvas #1E1E23 covers 59 percent of the page, with #1C3056 as the accent.
- Headings in agileSans at weight 300, 88 px.
- Spacing on a 4 px base unit, sections about 224 px apart.
-
12
Opal app site
Design by Opal, opalapp.com
- Dark canvas #040404 covers 89 percent of the page.
- Spacing on a 4 px base unit.
-
13
Raycast homepage
Design by Raycast, raycast.com
- Dark canvas #070A0A covers 90 percent of the page, with #451316 as the accent.
- Headings in Inter at weight 600, 64 px.
- Spacing on a 2 px base unit.
-
14
Tailwind CSS homepage
Design by Tailwind Labs, tailwindcss.com
- Light canvas #FDFDFD covers 83 percent of the page, with #9E3566 as the accent.
- Headings in Inter at weight 400, 96 px.
- Spacing on a 8 px base unit.
-
15
Hex homepage
Design by Hex, hex.tech
- Light canvas #F9F6F8 covers 92 percent of the page, with #8E95D1 as the accent.
- Headings in PP Formula SemiExtended at weight 700, 74 px, body in Cinetype.
- Spacing on a 4 px base unit, sections about 109 px apart.
-
16
Modal homepage
Design by Modal, modal.com
- Dark canvas #060C08 covers 92 percent of the page, with #7BE663 as the accent.
- Headings in ABC Diatype at weight 400, 44 px.
- Spacing on a 4 px base unit, sections about 144 px apart.
-
17
Apple MacBook Pro product page
Design by Apple, apple.com
- Dark canvas #030304 covers 59 percent of the page, with #3C239D as the accent.
- Headings in SF Pro Display at weight 600, 28 px, body in SF Pro Text.
- Spacing on a 4 px base unit, sections about 144 px apart.
-
18
Strava homepage
Design by Strava, strava.com
- Light canvas #FAFAF7 covers 64 percent of the page, with #726F08 as the accent.
- Headings in Boathouse at weight 600, 32 px.
- Spacing on a 4 px base unit.
-
19
Notion homepage
Design by Notion, notion.com
- Light canvas #FDFDFD covers 90 percent of the page, with #408FE1 as the accent.
- Headings in Inter at weight 600, 96 px.
- Spacing on a 2 px base unit, sections about 96 px apart.
-
20
Copilot Money app site
Design by Copilot, copilot.money
- Dark canvas #040E1E covers 84 percent of the page, with #5068F1 as the accent.
- Headings in Jokker Semibold at weight 600, 148 px, body in Jokker Medium.
- Spacing on a 4 px base unit.
What they share
Four habits the best landing pages have in common
Counted over the 20 picks above. Use it as a checklist for your own page, not as a template.
60%
Light canvas
Most picks sit on white or near white and save color for the action. Dark pages are mostly developer tools.
45%
One type family
One family for headings and body, with contrast from weight and size instead of a second face.
70%
Spacing on a 4 px grid
Gaps and paddings are multiples of 4, so blocks line up and the page feels calm even when it is dense.
Most used heading fonts
- Inter4
- Neue Montreal1
- Lausanne1
- Newsreader1
FAQ
Questions about the best landing pages
See every capture in landing page examples, narrow to SaaS landing page examples, or read the guide to what makes a landing page convert.
What makes a landing page one of the best?
One clear promise above the fold, one primary action, proof of the product close to the promise, and a calm visual system: a neutral canvas, one accent color, a strict type scale and spacing on a fixed grid. Every pick on this page meets all four.
How were these landing pages picked?
Editors capture new work every day and keep only the top 1 percent. This collection takes the 20 highest rated landing pages out of the 43 in the library and adds a short pattern breakdown to each.
Are the best landing pages light or dark?
Mostly light. 40 percent of the picks use a dark canvas, usually developer tools and product launches where screenshots of the product are dark too.
Which fonts do the best landing pages use?
Sans serif families lead, with Inter, Neue Montreal, Lausanne among the most used heading fonts in this collection. 45 percent of the picks use one family for both headings and body text.
Can I search landing pages by style?
Yes. Type a style such as "calm fintech landing page" into the style search, or upload a screenshot to find similar designs. The first search needs no account.
Save the ones you like to a board
Boards keep the source link and credit with every save, and share by private link.