Notion

Item: Notion
Rating: 8

AI workspace for notes, docs, knowledge and agents for teams.

8.0/10MABTU rating

DESKTOP · 1440 × 4,507/ ↗

MOBILE · 390

Section outline · Home

01heroCentred headline with swapping word pill, two buttons, doodle faces
02mediaLarge soft-shadow product demo window
03logo cloudTwo rows of greyscale logos
04featuresBento of grey cards with product UI crops and arrow buttons1,448
05use casesFive icon chips linking to use cases
06testimonialsThree duotone portrait cards with quotes772
07statsSingle-line ticker of usage stats
08ctaGrey band with two small buttons486
09footerLogo, quote and four link columns396

Rating · Home

Visual design8.2

UX & clarity8.6

Originality7.8

Craft & consistency8.4

Motion7.0

Performance & a11y7.7

This page scores 8.1; the site score weights the home page double.

Main colours

Light·white background·vivid

Typography

Notion Interheading · font · self-hosted Notion Interbody · font · self-hosted

Stack & style

Next.js Contentful Tailwind CSS React

Minimal Bento Illustration-led Product-UI-led Bento grid Hero video Logo cloud Marquee Stats band Sticky header

Also: Vercel, Cloudflare

Design DNA

Pure white page with a tight bold grotesk and a centred two-line headline whose middle word swaps inside a tinted pill ('Jam', 'Build'), a blue primary and pale-blue secondary button, and black-line doodles of faces. A product demo sits in a large soft-shadow window above a two-row logo cloud. Features form a bento of pale grey cards, each with a bold lead line, a round arrow button and a cropped product UI (meetings, dashboard, coding agent), plus a row of icon use-case chips. Testimonials are tall portraits washed in red, blue and yellow duotone, then a stats ticker, a quiet grey CTA and a sparse footer.

Worth borrowing

Swap one word of the hero headline inside a coloured pill to show several use cases in one line.
Wash customer portraits in bold single-colour duotones so testimonial cards double as brand colour.
Put a row of small icon chips with arrows under the feature bento as quick 'see what it can do' links.