Skip to content

Interactive Examples

Try these live demos built with rescript-tone and xote. Click "Start Audio" to initialize the Web Audio context, then interact with each demo.

Synth Keyboard

Synth Keyboard

Click a key to play a note. Choose different waveforms to change the timbre.

1open Tone
2
3let synth = Synth.makeWithOptions({
4 oscillator: {"type": "triangle"},
5 envelope: {
6 attack: 0.01, decay: 0.2,
7 sustain: 0.3, release: 0.8,
8 },
9})
10synth->Synth.asAudioNode->AudioNode.toDestination
11
12synth->Synth.triggerAttackRelease("C4", "8n")

Effects Chain

Effects Chain

FM Synth routed through Delay and Reverb. Adjust the wet mix of each effect.

1open Tone
2
3let synth = FMSynth.make()
4let reverb = Reverb.makeWithOptions({
5 decay: 3.0, wet: 0.5,
6})
7let delay = FeedbackDelay.makeWithOptions({
8 delayTime: "8n.", feedback: 0.3, wet: 0.3,
9})
10
11synth->FMSynth.asAudioNode
12->AudioNode.connect(delay->FeedbackDelay.asAudioNode)
13->AudioNode.connect(reverb->Reverb.asAudioNode)
14->AudioNode.toDestination

Step Sequencer

Step Sequencer

Toggle steps on/off to create a pattern. Uses Loop and Transport for timing.

1open Tone
2
3let synth = Synth.makeWithOptions({
4 oscillator: {"type": "square"},
5 envelope: {
6 attack: 0.01, decay: 0.1,
7 sustain: 0.1, release: 0.3,
8 },
9})
10synth->Synth.asAudioNode->AudioNode.toDestination
11
12let _loop = Loop.make(_time => {
13 synth->Synth.triggerAttackRelease("C4", "16n")
14}, "8n")
15
16let transport = Core.getTransport()
17transport->Transport.start()

Melody Sequencer

Melody Sequencer

Play a looping melody using Sequence and Transport. Adjust the BPM to change the tempo.

1open Tone
2
3let synth = Synth.makeWithOptions({
4 oscillator: {"type": "triangle"},
5 envelope: {attack: 0.01, decay: 0.1, sustain: 0.3, release: 0.5},
6})
7synth->Synth.asAudioNode->AudioNode.toDestination
8
9let notes = ["C4", "D4", "E4", "G4", "A4", "G4", "E4", "D4"]
10
11let _seq = Sequence.makeWithSubdivision(
12 (_time, note) => {
13 synth->Synth.triggerAttackRelease(note, "8n")
14 }, notes, "4n"
15)
16
17let transport = Core.getTransport()
18transport->Transport.start()

Drum Machine

Drum Machine

A drum sequencer with kick, snare, and hi-hat. Toggle steps on/off to create your own beat.

1open Tone
2
3let kick = Synth.makeWithOptions({
4 oscillator: {"type": "sine"},
5 envelope: {attack: 0.001, decay: 0.2, sustain: 0.0, release: 0.2},
6})
7kick->Synth.asAudioNode->AudioNode.toDestination
8
9let snare = Noise.makeWithOptions({"type": "white", volume: -10.0})
10snare->Noise.asAudioNode->AudioNode.toDestination
11
12let hihat = Noise.makeWithOptions({"type": "white", volume: -18.0})
13let hpf = Filter.makeWithOptions({frequency: 8000.0, "type": "highpass"})
14hihat->Noise.asAudioNode->AudioNode.connect(hpf->Filter.asAudioNode)
15hpf->Filter.asAudioNode->AudioNode.toDestination
16
17let _loop = Loop.make(_time => {
18 kick->Synth.triggerAttackRelease("C1", "16n")
19}, "8n")
20
21let transport = Core.getTransport()
22transport->Transport.start()

Filter Sweep

Filter Sweep

A sawtooth oscillator through a resonant low-pass filter. Sweep the cutoff frequency and resonance.

1open Tone
2
3let osc = Oscillator.makeWithOptions({
4 frequency: 110.0,
5 "type": "sawtooth",
6})
7
8let filter = Filter.makeWithOptions({
9 frequency: 500.0,
10 "type": "lowpass",
11 rolloff: -24,
12 q: 1.0,
13})
14
15osc->Oscillator.asAudioNode
16->AudioNode.connect(filter->Filter.asAudioNode)
17->AudioNode.toDestination
18
19// Sweep the filter cutoff
20filter->Filter.frequency->Param.rampTo(2000.0, "2m")
21
22osc->Oscillator.start()

Polyphonic Chords

Polyphonic Chords

Play chords using PolySynth. Each button triggers multiple notes simultaneously.

1open Tone
2
3let synth = PolySynth.makeWithOptions({
4 maxPolyphony: 6,
5 volume: -8.0,
6})
7synth->PolySynth.asAudioNode->AudioNode.toDestination
8
9// Play a C major chord
10synth->PolySynth.triggerAttackRelease(
11 ["C4", "E4", "G4"], "2n"
12)

AM Synth Pad

AM Synth Pad

Amplitude Modulation synthesis with reverb. Adjust harmonicity to change the modulation character.

1open Tone
2
3let reverb = Reverb.makeWithOptions({decay: 4.0, wet: 0.6})
4
5let synth = AMSynth.makeWithOptions({
6 harmonicity: 3.0,
7 oscillator: {"type": "sine"},
8 modulation: {"type": "square"},
9 envelope: {attack: 0.5, decay: 0.3, sustain: 0.8, release: 1.5},
10 modulationEnvelope: {
11 attack: 0.2, decay: 0.1, sustain: 0.5, release: 0.8,
12 },
13})
14
15synth->AMSynth.asAudioNode
16->AudioNode.connect(reverb->Reverb.asAudioNode)
17->AudioNode.toDestination
18
19synth->AMSynth.triggerAttackRelease("C3", "1n")
Was this page helpful?