Marketing

Marketing uses the same tokens, but turns the brand up: bigger type, the spectrum in blocks, live maps instead of screenshots.

Website (visualli.ai)

Hero: eyebrow kicker ("BUILT FOR SPATIAL MINDS"), a 72px ui 700 headline with exactly one Signature word, a 20px lede in ink-muted whose key verbs (at most three — "store, map and interact") are hand-set in hand at 1.15em in ink, without a swash, one primary (Join early access) and one ghost CTA, then a live VisualMap in a radius-xl frame with a Caveat annotation and a hand-drawn arrow that ends at a ringed node.
Sections breathe at space-9; headlines 40px ui 700, sentence case, period at the end.
How it works = three mini nodes with growing ring counts (0, 1, 2) — the rings teach the product.
The closing band is root-ink with a SpectrumBar across its top edge. This replaces the blue→pink gradient pill: the CTA there is a white pill on root-ink.
Light and dark are both first-class; the page follows the visitor's system setting.

Responsive at three widths, no horizontal scroll at any width:

Width	Layout
> 1024px (desktop)	As above. The annotation's hand-drawn arrow shows only above 1180px, where it lands exactly on a ringed node.
≤ 1024px (tablet)	Side gutters `space-6`; the open-standard / co-creation pair stacks; steps stay three across while there is room (min 190px each). Below 1180px the annotation becomes a centered caption above the map.
≤ 760px	Nav links fold into a menu button; Join early access stays visible.
≤ 640px (phone)	Gutters `space-4`; hero CTAs stack full-width; steps become rows (mini node left, text right); the map frame is 400px tall; closing band and footer tighten.
Headline, lede and section heads scale fluidly with `clamp()` (headline 36 → 72px) rather than jumping at breakpoints.

600px table layout, light theme values written literally (mail clients ignore CSS variables): #f6f3ee ground, #ffffff sheet, #182140 ink, #4f5671 muted.
Top: a 6px spectrum stripe of seven cells. Then the wordmark (24px tall), an eyebrow ("RELEASE NOTES · OCTOBER 2026"), a 34px headline with one hand-set word, a two-sentence lede.
One visual (pastel blob nodes, or a PNG export of a real map), then up to three items, each marked with a topic dot, then one pill button and an optional Caveat aside.
Fonts fall back to Helvetica/Arial and cursive; the copy must still work in those.

Format	Size	Pattern
Stat / quote	1080 × 1080	Eyebrow, one huge number in `ui` 700, one line, a Caveat aside, one ringed node, wordmark bottom-left
Announcement	1200 × 675	Text half + live map half
Carousel cover	1080 × 1350	Spectrum stripe, eyebrow, 96px title, a cluster of nodes, "swipe →" in Caveat
One idea per post, one hand-set word or annotation at most, no gradients.

Title slide on root-ink with the spectrum stripe and the tree mark on a white disc; content slides on surface; the closer on topic-sun.
Big numbers in ui 700 at 120px+; Caveat only for citations and asides ("Ebbinghaus, 1885").
Diagrams are drawn with Node and Edge, never with clip-art or stock icons.
House phrases: "From 100 hours → one A3.", "Bring anything.", "Create lasting learners.", "Hop on."