Halden: architecture studio website

01

Overview

Halden is a homepage template for architecture and design studios. It opens on a sticky sequence of five projects, each one uncovering the last, then moves through a manifesto, a project index, practice, process, awards and the studio itself across twelve sections.

Every visible string lives in one content file, colour and type are a handful of tokens, and the site exports to static files you can upload anywhere. The demo studio, its people and projects are fictional, ready to be replaced with yours.

02

Features

1. 01
   Five-project heroA sticky scroll sequence where each project uncovers the last, with previous and next image peeks.
2. 02
   Word morphA pinned signature moment: an outlined word wipes into a solid one over drawn contours. VOID becomes FORM by default.
3. 03
   Project indexLarge rows with a preview that trails the cursor, and inline images on touch screens.
4. 04
   Process layersA pinned isometric stack that assembles layer by layer as you scroll.
5. 05
   One content fileStudio details, projects, awards, clients and team are all edited in a single file.
6. 06
   Accessible motionReduced-motion settings turn off pinning and scrubbed sequences, and every hover has a focus or touch equivalent.

03

Perfect for

1. 01
   Architecture studios
2. 02
   Interior designers
3. 03
   Landscape architects
4. 04
   Design practices

04

Built with

Next.js 15, React 19, GSAP 3, Lenis