Menu

How I built a 7KB offline Focus & Brown Noise synth inside a single HTML file (No MP3s, just Web Audio API math)
🖼️

How I built a 7KB offline Focus & Brown Noise synth inside a single HTML file (No MP3s, just Web Audio API math)

DEV Community: webdev·lnz79d612·about 21 hours ago
#plTtiGDp
#devtowebdev#devto#dev#file#noise
Reading 0:00
15s threshold

I wanted a clean focus timer, scratchpad, and ambient sound generator that works 100% offline without accounts, cloud sync, or bloated desktop apps.

So under my indie label Appthecary , I built Kanso : a minimalist workspace that lives entirely inside a single 7KB .html file you can drop on your desktop or USB drive.

Synthesizing Brown Noise with Math (Zero MP3s)

Instead of bundling heavy audio loops, Kanso uses the browser's native AudioContext to generate a 3-second looping buffer of procedural brown noise by integrating white noise samples in real time, routed through a BiquadFilterNode (low-pass filter from 120Hz to 1500Hz):

let lastOut = 0.0 ; for ( let i = 0 ; i < bufferSize ; i ++ ) { const white = Math .…

Continue reading — create a free account

Join HashtagPLUS to read full articles, follow hashtags, vote, and join the conversation.