Does the WAV export sound exactly like the keyboard playback?

Yes. Both paths run the same deterministic offline renderer — oscillator, ADSR, filter, LFO and all three effects — so the file you download is sample-for-sample the sound you auditioned. The same engine also powers the retro SFX one-shots and the Algorithm Arena sonification, which is why they share a character.

How does the PWM duty control work on the square wave?

Web Audio's built-in square is fixed at 50% duty, so the studio synthesizes other duties from the Fourier series of a pulse wave (as a PeriodicWave in the exported code, and directly in the offline renderer). Narrow duties sound thin and nasal; near 50% they open up; sweeping the duty is the classic chip-music 'hollow' effect.

Can I use my MIDI keyboard?

In Chrome or Edge, yes — press Connect MIDI and grant access. Note-on and note-off messages drive the same voices as the on-screen keys. Safari doesn't implement Web MIDI, so the button is hidden there rather than broken (per the tool's accessibility policy). Velocity affects nothing at the DSP level but is wired through the handler for future use.

What are the computer keyboard mappings?

The tracker layout printed on the keys: whites A S D F G H J K L ; ' and blacks W E T Y U O P, covering two octaves from C4. It's the layout trackers (FastTracker, Renoise) and DAWs inherited, so muscle memory transfers.

Why does the FFT show fewer harmonics after I lower the cutoff?

That's the lowpass doing its job — a filter removes harmonics above its cutoff, and the spectrum makes it literal. Set a high resonance Q and you'll also see a peak right at the cutoff frequency, which is the characteristic squelch of acid-style patches.

What do pink and brown noise sound like, and when do I use them?

White noise has equal energy per Hz and sounds like static; pink has equal energy per octave and sounds balanced (rain, wind); brown runs -6 dB/octave and rumbles (waterfalls, thunder). Kick drums, snare washes and cymbals usually start from pink; explosions from brown.

Is the exported JS code really dependency-free?

Yes — it builds the voice with raw Web Audio nodes (OscillatorNode, BiquadFilterNode, WaveShaperNode with a generated tanh curve, DelayNode with feedback, ConvolverNode with a generated impulse response) and schedules the ADSR with AudioParam ramps. Paste it in any page and call the function; no libraries, no bundler assumptions.

When do MP3 and OGG exports arrive?

They're stubbed behind an explicit encoder decision (ADR pending) because in-browser MP3/OGG encoding means picking a WASM encoder with size and licensing tradeoffs. WAV at 8/16/24-bit covers lossless needs today; watch the changelog once the ADR lands.

Web Audio Modular Synthesizer & Sound FX Generator

Design a synth voice — oscillator, ADSR, biquad filter, LFO, overdrive, delay and reverb — play it on the keyboard, watch the FFT, then export WAV or copy-paste Web Audio code.

Oscillator

Gain50%Detune0¢ADSR envelopeAttack10msDecay120msSustain70%Release250ms

Biquad filter

Cutoff2.2kHzResonanceQ 1.0LFO

Rate5.0HzDepth30%

EffectsOverdriveStereo delayReverb

Presets

Audio output needs a browser with Web Audio support.

Play with your mouse, the computer keys printed on the keys (A W S E D…), or a MIDI keyboard (Chrome/Edge).

Retro SFX one-shots

One-click game sounds rendered by the shared engine — the exact same DSP that powers the WAV exports.

Export

NoteA4

Length0.8s

WAV exports render the current patch offline (including effects) — identical samples to what you hear. MP3/OGG will use ffmpeg.wasm (ADR-0008), lazy-loaded on first click.

Export

// Generated by DevTools Synth Studio — paste into any page or devtools console.
// Plays one 0.8-second A4 note through the full chain (tweak freely).
function playSynth() {
  const ctx = new (window.AudioContext || window.webkitAudioContext)();
  const now = ctx.currentTime;
  const noteDuration = 0.8;
  const patch = {"waveform":"sawtooth","gain":0.5,"envelope":{"attack":0.01,"decay":0.12,"sustain":0.7,"release":0.25},"filter":{"type":"lowpass","frequency":2200,"q":1},"lfo":{"target":"filter","rate":5,"depth":0.3}};

  // --- Voice: oscillator → filter → ADSR gain
  const gain = ctx.createGain();
  gain.gain.value = 0;
  const osc = ctx.createOscillator();
  osc.type = "sawtooth";
  osc.frequency.value = 440;

  const filter = ctx.createBiquadFilter();
  filter.type = "lowpass";
  filter.frequency.value = 2200;
  filter.Q.value = 1;
  osc.connect(filter);

  // --- LFO (filter)
  const lfo = ctx.createOscillator();
  lfo.frequency.value = 5;
  const lfoGain = ctx.createGain();
  lfoGain.gain.value = 2200 * 0.3;
  lfoGain.connect(filter.frequency);
  lfo.start(now); lfo.stop(now + noteDuration + patch.envelope.release);

  // --- Effects chain

  // --- ADSR envelope on the voice gain
  const t0 = now;
  const a = patch.envelope.attack, d = patch.envelope.decay, s = patch.envelope.sustain, r = patch.envelope.release;
  gain.gain.setValueAtTime(0, t0);
  gain.gain.linearRampToValueAtTime(patch.gain, t0 + a);
  gain.gain.linearRampToValueAtTime(patch.gain * s, t0 + a + d);
  const off = t0 + Math.max(a + d, noteDuration);
  gain.gain.setValueAtTime(patch.gain * s, off);
  gain.gain.linearRampToValueAtTime(0, off + r);

  filter.connect(gain);
  gain.connect(ctx.destination);
  osc.start(now);
  osc.stop(off + r + 0.1);
}

playSynth();

About this tool

Design synth voices with ADSR, filters, LFO, overdrive, delay and reverb — play by mouse, keyboard or MIDI, watch the FFT, and export WAV or ready-to-paste Web Audio code. Web Audio Modular Synthesizer & Sound FX Generator runs in the browser on DevTools. There is no signup, and your input stays on this device unless the tool explicitly performs a live network lookup.

What this tool does not do

Web Audio Modular Synthesizer & Sound FX Generator is a free in-browser utility, not a hosted API. It does not keep server-side history and is not a substitute for production verification in your own stack.

How do I use this tool?

How do I use Web Audio Modular Synthesizer & Sound FX Generator?
Open Web Audio Modular Synthesizer & Sound FX Generator, enter or paste your input, and copy the result. The page works without an account.

Web Audio Modular Synthesizer & Sound FX Generator

About this tool

What this tool does not do

How do I use this tool?

How do I use Web Audio Modular Synthesizer & Sound FX Generator?

One Pixel at a Time: Thinking in Fragment Shaders

Subtractive Synthesis in Ten Minutes: What Every Slider Actually Does

Ambient Noise Generator

Audio BPM Tap & Tempo Detector

Audio dBFS, dBu, dBV & Voltage Converter

Binaural Noise Synthesizer

Metronome & Instrument Tuner

Morse Spectrogram Decoder

Web Audio Modular Synthesizer & Sound FX Generator

About this tool

What this tool does not do

How do I use this tool?

How do I use Web Audio Modular Synthesizer & Sound FX Generator?

Related guides

One Pixel at a Time: Thinking in Fragment Shaders

Subtractive Synthesis in Ten Minutes: What Every Slider Actually Does

Related tools

Ambient Noise Generator

Audio BPM Tap & Tempo Detector

Audio dBFS, dBu, dBV & Voltage Converter

Binaural Noise Synthesizer

Metronome & Instrument Tuner

Morse Spectrogram Decoder