Live page · scroll inside

PremiumCollaborative docs · light · landing page · gsap · lenis · html

Hive

A collaborative-docs site in lilac white with violet, coral, teal and amber people colours: the hero is a live document where three named cursors work in a 13-second loop (one types a timeline row with her own caret, one selects and bolds a phrase from a pop-up toolbar, one anchors a comment and gets a reply) and your pointer joins as a fourth 'You' cursor, with pause. Then a 'while you were out' catch-up digest, a five-block bento with a live poll, menu-board pricing and a violet CTA.

What's inside

01
Chairs bar
Solid after 80 px.
02
Multiplayer doc hero
A 13 s loop: Ines glides to the timeline and types a new line with her own caret; Tobi selects 'two new sourdoughs', a toolbar pops and the phrase turns bold; Rafe anchors a comment on 'seeded rye' and a thread slides into the margin, Ines replies. Then the edits fade back and it starts again. Pause stops everyone; off-screen it idles.
03
Catch-up digest
Digest rows rise one by one.
04
Block bento
Tiles rise in sequence; the poll bars grow when visible.
05
Menu-board pricing
Rows rise.
06
Violet chair band
Heading lines rise.
07
Footer
None.

Utility pages in the same file: 404 · Style guide · Password · Changelog

How to use it

From prompt to a live page.

01
Walk the page
The preview is the real template: loader, scene, scroll choreography. Scroll inside it or open it full-screen.
02
Pick a palette
Token sets re-tint the whole page live, scene included. The prompt carries the one you chose.
03
Pick your stack
Single HTML, Next.js, React, Vue, Astro, WordPress blocks, Shopify sections or a Webflow build guide.
04
Copy the prompt
It carries the art direction, the tokens, the motion system and every section's layout, motion and content, in order.
05
Make it yours, then iterate
Swap copy and images first, keeping the structure. Then refine section by section rather than re-running the whole prompt.

More templates

Free♥ 0

Abacus

Accountancy practice

Template

Premium♥ 0

Kittiwake Air

travel/regional airline

Template

Premium♥ 0

Laneline

sport/mobile app

Template

Free♥ 0

Beacon

Feature flags

Template

Loading…

Hive

What's inside

Chairs bar

Solid after 80 px.

Multiplayer doc hero

A 13 s loop: Ines glides to the timeline and types a new line with her own caret; Tobi selects 'two new sourdoughs', a toolbar pops and the phrase turns bold; Rafe anchors a comment on 'seeded rye' and a thread slides into the margin, Ines replies. Then the edits fade back and it starts again. Pause stops everyone; off-screen it idles.

Catch-up digest

Digest rows rise one by one.

Block bento

Tiles rise in sequence; the poll bars grow when visible.

Menu-board pricing

Rows rise.

Violet chair band

Heading lines rise.

Footer

None.

How to use it

From prompt to a live page.

Walk the page

The preview is the real template: loader, scene, scroll choreography. Scroll inside it or open it full-screen.

Pick a palette

Token sets re-tint the whole page live, scene included. The prompt carries the one you chose.

Pick your stack

Single HTML, Next.js, React, Vue, Astro, WordPress blocks, Shopify sections or a Webflow build guide.

Copy the prompt

It carries the art direction, the tokens, the motion system and every section's layout, motion and content, in order.

Make it yours, then iterate

Swap copy and images first, keeping the structure. Then refine section by section rather than re-running the whole prompt.