TinyMusic
A tiny JavaScript synth and sequencer built on the Web Audio API. Give it note strings like Bb3 e, a tempo, and a sequence; TinyMusic schedules the oscillators, gain, and EQ underneath.
For the full demo, make sure your volume is up and your phone isn’t muted or on silent.
Play the sequence
Ready to play a 132 BPM square-wave sequence.
Small on purpose
Each note is just a pitch and duration in a string: A5 q plays A5 for a quarter note; e, q, and h mean eighth, quarter, and half notes. TinyMusic turns that compact notation into a Web Audio oscillator, a gain node, and a small three-band EQ chain—enough to make a practical browser sequencer without a framework, sample pack, or application UI.
It was built for the size-constrained spirit of JS13k: keep the primitive small, let the calling code decide the instrument and experience.
The sequence
A pared-back arrangement of “Seventeen Years” by Ratatat, expressed as the lead, delayed harmony, and bass arrays that drive the demo above.
const tempo = 132;
const lead = [
'- e', 'Bb3 e', 'A3 e', 'Bb3 e', 'G3 e', 'A3 e', 'F3 e', 'G3 e',
'E3 e', 'F3 e', 'G3 e', 'F3 e', 'E3 e', 'F3 e', 'D3 q',
'- e', 'Bb3 s', 'A3 s', 'Bb3 e', 'G3 e', 'A3 e', 'G3 e', 'F3 e', 'G3 e',
'E3 e', 'F3 e', 'G3 e', 'F3 e', 'E3 s', 'F3 s', 'E3 e', 'D3 q'
];
const harmony = [
'- e', 'D4 e', 'C4 e', 'D4 e', 'Bb3 e', 'C4 e', 'A3 e', 'Bb3 e',
'G3 e', 'A3 e', 'Bb3 e', 'A3 e', 'G3 e', 'A3 e', 'F3 q',
'- e', 'D4 s', 'C4 s', 'D4 e', 'Bb3 e', 'C4 e', 'Bb3 e', 'A3 e', 'Bb3 e',
'G3 e', 'A3 e', 'Bb3 e', 'A3 e', 'G3 s', 'A3 s', 'G3 e', 'F3 q'
];
const bass = [
'D3 q', '- h', 'D3 q', 'A2 q', '- h', 'A2 q',
'Bb2 q', '- h', 'Bb2 q', 'F2 h', 'A2 h'
];
const leadSequence = new TinyMusic.Sequence(ac, tempo, lead);
const harmonySequence = new TinyMusic.Sequence(ac, tempo, harmony);
const bassSequence = new TinyMusic.Sequence(ac, tempo, bass);
leadSequence.play(when);
harmonySequence.play(when + (60 / tempo) * 16);
bassSequence.play(when);