Build Websites Lab

Concept 04

Resonance

A website you can hear. Every section composes its own music, live, and it changes as you move.

Best with headphones

01 · Dawn

Hear the page.

Nothing here is a recording. A small orchestra of oscillators is composing in your browser right now, in the key of this section.

Key C major

02 · Tide

Move to shape it.

Your cursor is the conductor. Left and right moves the sound around your head. Up and down opens and closes the filter. Try it slowly.

03 · Pulse

Feel the beat.

The rhythm section just came in. On a phone you’ll feel each section change as a tap in your hand, and the visuals breathe with the bass.

04 · Night

Stay a while.

A sound studio’s portfolio, a festival, a hotel, a gallery — some brands should be felt, not just read. Hover a project to hear it.

How it works. The music is generated with the Web Audio API: detuned oscillator pads through a filter and a synthetic reverb, a plucked arpeggiator with echo, and a drum machine built from pure maths. A spatial panner (HRTF) places it around your head. An analyser feeds the frequency spectrum into a WebGL shader every frame — that is why the colours pulse with the bass. No audio files, no plugins. Studio and projects are fictional.