ambiently

Ambient sound for the web, in five lines.

Layer 24 field recordings, 12 music loops and 25 synthesised ambiences, from rain and surf to a lo-fi beat and a ticking clock. Fade everything, send any layer to a shared reverb, crossfade scenes, and never think about autoplay again.

npm install ambiently
Rainy café3 layers · tap play to unlock audio

Mixer

Soft rain

Recording · CC0

Café chatter

Recording · CC0

Lo-fi beat

Music · CC0

32 scenes

Each one is a few layers with volumes. Pick one, then bend it with any sound below.

Outdoors
Indoors
Music
On the move
Elsewhere

All 61 sounds

Tap one to add it to the mix, tap again to take it out. The code at the bottom updates as you go.

import { AmbientlyEngine } from 'ambiently';

const ambient = new AmbientlyEngine([
  { id: 'rain-rec', src: '/sounds/rain.m4a', volume: 0.50 },
  { id: 'cafe', src: '/sounds/cafe.m4a', volume: 0.35 },
  { id: 'lofi', src: '/sounds/lofi-relax-beat.mp3', volume: 0.45 },
]);

ambient.play();

Layers, not a tag

Each sound has its own gain. Stack rain under a beat under a fireplace and mix live.

Nothing clicks

Play, pause, volume and scene changes are gain ramps on the audio clock.

Synth ambiences

Twenty-five are generated in the browser: rain, surf, a stream, thunder, crickets, birds, a clock, vinyl, a heartbeat, even a lo-fi beat and a music box. No files.

One shared room

Every layer has a reverb send into a synthetic hall. Set it per layer, or leave it dry.

Autoplay handled

The context wakes on the first gesture and starts whatever you asked for.

React ready

useAmbiently() keeps your layers in sync and re-renders on every change.

Tiny

About 9 kB gzipped, zero dependencies, ESM and CJS, typed.

Credits34 recordings and music loops, all CC0 from Freesound via Openverse. The library itself ships no audio.