Cosmos

Item: Cosmos
Rating: 8.1

Visual search and collections for creative reference.

8.1/10MABTU rating

DESKTOP · 1440 × 6,196/ ↗

MOBILE · 390

Section outline · Home

01heroFloating 3D image tiles, centred type, two black CTAs900
02videoFull-bleed muted film with inline play label1,170
03featureThree-up image strip with search pill overlay668
04featureThree labelled cards: by colour, similarity, without AI632
05featureRight-aligned text beside one tall photo640
06logosTwo rows of grey luxury and museum logos218
07ctaFloating tiles behind black sign-up button
08footerOversized COSMOS wordmark, thin link columns

Rating · Home

Visual design8.3

UX & clarity7.8

Originality8.0

Craft & consistency8.2

Motion7.5

Performance & a11y9.0

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

Main colours

Light·white background·vivid

Typography

Cosmos Oracleheading · font · self-hosted Cosmos Oraclebody · font · self-hosted

Stack & style

Next.js React Sanity Tailwind CSS

Minimal Editorial 3D Photography-led Hero video Logo cloud Parallax Sticky header Tabs

Also: Amazon CloudFront

Design DNA

Warm off-white canvas with rendered 3D image chips drifting across the hero, centred small-caps wordmark above a two-line medium-weight headline and a black pill CTA. Sections alternate full-bleed muted video, three-up image cards labelled in tiny grey captions, and one asymmetric left-aligned statement with a single tall photo. Colour comes only from the imagery; a red swatch card carrying its own hex is the loudest element. Logo wall of luxury brands in thin grey. Closing band repeats the floating tiles behind a black sign-up button.

Worth borrowing

Scatter product imagery as loose 3D chips around the hero instead of one screenshot.
Label feature images with 12px grey captions under the image rather than headings above it.
Show search-by-colour by printing the hex code straight on the coloured card.