Skip to main content

Inspiration tag · 2 sites catalogued

Rainbow Semantic marketing pages

2 sites in our growing collection share the rainbow semantic signal — Notion, Spline. Each catalogued page carries a paste-ready 24-field design brief — palette, typography, spacing, motion — that an AI agent can drop into Claude, Cursor, or v0.

Notion Full Page

Full Page · both

Notion

The productivity-tool landing that treats the interface itself as the product — every surface feels like a well-crafted page in a well-crafted notebook. Notion carries paper-feel warmth on a warm off-white canvas, pairs a commissioned optical sans (NotionInter) with a serif (Lyon Text), a monospace (iA Writer Mono), and a sticker font (Permanent Marker), then cascades 4-5 soft shadow layers at sub-5% opacity to simulate ink on real paper. Rainbow accents are semantic vocabulary — link blue, editorial orange, citation brown — each tied to a specific content role.

Spline Full Page

Full Page · dark

Spline

The 3D-tool landing that refuses to flatten itself into a screenshot — pure #000 canvas, a three-family Spline Sans / Brockmann / Spline Sans Mono trinity, and a semantic rainbow of accent CSS variables used one tone at a time. Spline demonstrates a rare creative-tool discipline: zero shadow, zero gradient, a single 1px hairline carrying every layer distinction, all motion compressed into a 0.2s CSS transition with no library overhead. The spacing scale starts at 2px so embedded canvases and video loops can breathe without feeling airy.

Back to full gallery

AI2 Design counts anonymous traffic always — no cookies, no identifiers, no fingerprinting. For optional session insights (PostHog, EU region) — page funnel, performance — turn on opt-in analytics below. Cookie policy.