Example and tutorial: Simple synth keyboard (developer.mozilla.org)

This article presents the code and working demo of a video keyboard you can play using the mouse. The keyboard allows you to switch among the standard waveforms as well as one custom waveform, and you can control the main gain using a volume slider beneath the keyboard. This example makes use of the following Web API interfaces: AudioContext, OscillatorNode, PeriodicWave, and GainNode. https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API/Simple_synth