A real sticky stack
Four full-viewport layers pin at the top of the frame. As the next layer arrives, the one beneath scales down and dims, so depth comes from the scroll itself.
Build guide
Palimpsest
An archive stacked like the studio itself, where scrolling lifts one layer off the one beneath it.
How it was made
One visual idea, held from the first sketch to the last media query.
The cursor index
A plain text list of the four works. On a fine pointer, the piece being read floats beside the cursor; on keyboard focus it docks quietly at the edge of the screen.
Layered type
Cormorant carries the big italic layer names while Alegreya Sans keeps the captions and labels useful. One family for feeling, one for reading.
Calm fallbacks
Reduced motion unpins the stack into a simple vertical flow, the floating preview never renders, and every layer keeps its full caption.
Three release passes
Every pass ran on real desktop and phone renders, and only counted when it fixed something you could see.
Stack physics
Tuned the recede so the outgoing layer shrinks toward the top of the frame instead of the center, which keeps the incoming image feeling like it lands on top.
Index manners
Kept the floating preview out of touch layouts and gave keyboard users a docked preview instead of a cursor-following one.
Mobile and access
Verified the phone stack, the native menu, focus rings on every index row, contrast in both palettes, and overflow at 390 pixels.
A reusable recipe
Write the scene before the palette. Choose what visitors should physically feel, then set color, type, motion, and material around it.
The artwork stays in charge. Code and procedure can set the atmosphere, but they never stand in for the work.
Reduced motion, focus states, and a stable fallback ship first. Spectacle comes last.