drums · Web MIDI · runs in the browser

Drums

Drums is a browser app that accompanies an electronic drum kit. It follows your tempo, learns the repeating pattern of each drum you play, and answers with bass, chords, arpeggios, riffs and bursts on separate MIDI channels, for the sampled instruments in your DAW. It is one page of plain ES modules: nothing is uploaded and there is no build step.

Open Drums Connect a kit

No kit to hand? Try a groove in the app plays a demo, and the keyboard keys Z–, are pads.

Drums' fullscreen live view during the demo groove: 110 BPM, a four-step bar indicator, a large C minor chord, the kit's pads with the hi-hat and snare lit and their learned cycles and lock confidence, and a column of triggered voices: bass G2, chords G4, E flat 4 and C4, pulse G5.
The live view for streaming and stages: the kit lights as you play, each pad shows its learned cycle, and the band's notes appear as they are sent.

How a hit becomes a band

Every MIDI note from the kit is mapped to a piece and read by four listeners at once. One owns time: a tempo follower turns a pulse you choose into a single quarter-note clock. The others own shape: a learner per piece finds the cycle that drum repeats, an intensity tracker follows how hard and how often you play, and a harmony grammar decides when the chords should move. The instrument rack turns all of it into notes and articulation keyswitches, and a scheduler sends them, timestamped, to your DAW.

How a hit becomes a band Signal flow in Drums. An electronic kit's MIDI notes arrive through Web MIDI and are mapped to pieces (kick, snare, hats, toms, ride, crash). Four listeners read the stream: the tempo follower turns a chosen pulse source into one quarter-note clock; per-piece rhythm learners fit repeating cycles; an intensity tracker follows hit rate and velocity; and a harmony grammar reads density, tom fills and crashes to move the chords. The instrument rack (up to fifteen entries: bass, chords, arpeggios, riffs, Euclidean rhythms, kit-triggered bursts) turns these into notes and keyswitches, which a foreground scheduler sends, timestamped, to a DAW whose sampled instruments make the sound. MIDI clock can go out too, and a small browser synth previews without a DAW. your kitMIDI notes kit mapnote → piece tempo followerone quarter-note clock rhythm learnersa cycle per piece intensityrate · velocity harmony grammardensity · fills · crashes instrument rack≤ 15 entriesnotes + keyswitches scheduler8 ms timer25 ms horizon DAWsampled instruments MIDI out+ clock
Four listeners, one rack. Tempo is one clock for the whole band; rhythm is learned per piece, so a busy hi-hat never votes the tempo up.

Finding the tempo

You tell Drums which drums keep time (hi-hats, kick, snare, ride, the kick and snare together, or every hit) and how many grid notes make a beat. Then one of two methods reads the clock.

Steady pulse

Every hit is the next grid step. That suits one timekeeper, an eighth-note hi-hat or a ride, and handles swing. It is what single sources use by default.

Groove grid

Hits land on a grid, with rests and mixed pads. Drums merges hits closer than the merge window (a flam, a kick under a hat) into one onset, then looks for the coarsest step that explains nearly every gap between onsets and reads it as one grid note.

Finding the tempo in a groove How the Groove grid method reads a tempo, using the app's own code on a synthetic two-bar groove at 132 BPM: kick on one, three and the and of three, snare on two and four, hats on eighths, merged into one onset stream with a 51.1 millisecond merge window and up to six milliseconds of jitter. Every gap between onsets is scored against candidate grid steps from 40 to 240 BPM; the support curve shows the share of gaps each step explains. The coarsest candidate within 0.1 of the best support is refined by least squares to a 227.08 ms step, read as a sixteenth: 66.05 BPM, because nothing finer than eighths was played. Kick and snare then sit on opposite halves of that beat (kick resultant 0.746, snare 1), so the beat was really two beats and the tempo doubles to 132.1 BPM. a · onsets as played, two bars hat snare kick merged fitted step 227.08 ms · every gap a whole number of steps b · share of gaps each candidate tempo explains 0 0.5 0.7 1 40 60 80 120 160 240 candidate BPM (sixteenth grid) grid fit 66.0 BPM coarsest step that explains every gap × 2 = 132 BPM kick on one half, snare on the other 0.7: the least support a grid may have
The app's own fit, on a synthetic groove. Nothing finer than eighths was played, so the grid reads eighths as sixteenths: half speed. Kick and snare on opposite halves of that "beat" give it away, and the tempo doubles.

The candidate tempos run from 40 to 240 BPM in 0.4% steps, and a gap counts as explained when it is within a quarter step, or 25 ms, of a whole number of steps. The winner is refined by least squares and rejected if its support falls below 0.7 or if one gap length is off by a consistent amount, which is what swing misread as a straight grid looks like. Once a tempo is established, a reading at ½, 2, ⅓, 3, ¼ or 4 times it is taken as a change of subdivision, not a tempo jump, so a run of eighths or a 32nd fill doesn't double the band.

Learning each drum's cycle

Tempo and rhythm are separate questions. Each drum piece gets its own model, fed unsnapped beat positions and velocities, which looks for the shortest cycle that repeats: onsets, rests and accents compared over up to four completed cycles, from a 256-hit history per piece. A lock needs at least three cycles of sustained evidence, survives fills and silence, and only changes after sustained contradictory playing; Hold freezes it. Each band lane then follows the drum you pick: by default the bass follows the kick, the chords the snare and the pulse the ride.

Cycles and tuplets Three rhythms against four-four bars over sixteen beats. A 5/4 cycle repeats five quarter notes, so its accent drifts across the bar lines and returns after twenty beats. A 5:4 tuplet puts five evenly spaced attacks into four quarter notes and lines up with every bar. A 7/8 chug repeats every three and a half beats, the cycle Drums' chug template uses, and meets the bar line again after seven bars; the figure shows the first four. bar 1 bar 2 bar 3 bar 4 5/4 cycle five quarters, repeating 5:4 tuplet five over four 7/8 chug cycle of 3½ beats
5/4 is not 5:4. Cycle length (polymeter) and the subdivision inside a beat (polyrhythm) are learned independently, and the app keeps them apart.

Automatic cycles run from 1 to 11 quarter notes, including the halves (2½, 3½, 4½, 5½), on quarters, eighths, sixteenths, triplets, sextuplets, quintuplets, septuplets and tuplets such as 3:2, 5:4 and 7:4; explicit meters reach 13/16, 15/8 and 16/4. Drums is honest about what timing cannot tell it: a three-beat cycle is shown as 3/4 · 6/8, uniform quarters as an N-beat motif rather than a bar, and a fit percentage as agreement, not certainty.

The band

Drums' main view during the demo: tempo 110 BPM with Follow kit selected and bar three of four lit, a large D diminished chord in C minor, the Your groove list with the hi-hat locked to a one-beat motif at 100% and kick and snare still learning, and The band with bass, chords and pulse lanes, their velocities and rhythm sources.
The main view: tempo and bar, the chord and why it changed, each drum's learned cycle, and the band's lanes with their sources.

An instrument rack

Up to fifteen entries on their own MIDI channels (channel 10, drums, excluded): bass lines, chord layers, arpeggiators, melodic lines, drones, riff and chug sequencers, Euclidean rhythms and kit-triggered instruments. Each has its own rhythm source, register, melody, gate, voicing and articulation. Templates include a kick-triggered guitar, a 7/8 chug guitar and a four-part Heavy rig: a kick-locked gallop, a thirteen-sixteenth polymeter riff, snare tritone stabs and crash sub-drops, in Phrygian with heavy harmonic shifts. All patterns are original.

Harmony that follows the playing

A bounded grammar watches drum density, tom fills and crash accents: busy bars open the harmony, sparse bars hold it, and phrase endings lead back to the tonic, with a leading tone on minor cadences. A fill before a phrase boundary can visit the relative key or a fifth away, and the next phrase resolves home. Changes are bar-quantised, and the reason for each is shown.

Odd bars, breakdowns and sections

The whole band can play in 7/8, 13/16 or an Auto meter taken from the snare's locked cycle. A half-time, heavy passage is detected as a breakdown, after which guitars chug the home root or a breakdown profile takes over until the backbeat returns. Profiles chain into song sections that switch on the next bar, and Birthday mode turns the band into Happy Birthday in your key.

Bursts

A kit-triggered instrument fires 1 to 32 notes per hit, or a cycle of counts such as 1,2,3,2, timed as sixteenths, triplets, quintuplets or a whole bar of a chosen meter, at the tempo captured when the group starts. A ride hit becomes a triplet figure; a kick becomes a pair; each entry advances its own cycle once per accepted hit.

A kit-triggered burst A kit-triggered instrument with Notes per hit set to the cycle 1, 2, 3, 2 and Burst timing set to eighth-note triplets. Each ride hit advances the cycle once and fires that many notes, spaced as eighth-note triplets from the hit at the tempo captured when the group starts. With Retrigger set to Restart, a hit that arrives while a group is still playing cuts the unfinished notes; Overlap would let both groups sound; Ignore would skip the hit. beat 1 beat 2 beat 3 beat 4 beat 5 beat 6 beat 7 ride hits notes out counts 1·2·3·2 1 2 3 2 1 restart: the rest of the earlier group is cut
Restart, Overlap or Ignore. What a new hit does to a group still playing; Restart is the default.

Talking to real instruments

The sound comes from your DAW: sampled guitars and basses in Kontakt, monitored on the channels the rack sends. Articulation (sustain, palm mute, dead notes, harmonics, power chords) is chosen by tracked intensity or a phrase, and sent as a keyswitch on the lane's own channel ahead of the note.

Keyswitches before notes How Drums tells a sampled guitar which articulation to play. A keyswitch note goes out twelve milliseconds before the musical note by default. In Held mode the switch stays down until the articulation changes, the lane is muted or the band stops, and the old switch is released before a new one is pressed; repeated notes in the same articulation do not retrigger it. In Latched mode each change sends one short selection pulse. 0 ms 100 ms 200 ms 300 ms 400 ms 500 ms 600 ms 700 ms 800 ms 900 ms notes held latched mute mute mute sustain sustain palm-mute key held sustain key held 12 ms lead
One switch per lane. The previous switch is released before the next; an unchanged switch is never retriggered.
Preset keyswitch MIDI numbers (editable)
ArticulationDjinnBass 2Shreddage Argent
Sustain00
Palm mute171
Staccato—2
Dead / choke37
Harmonic89
Power chord—3
Muted power chord—4

Argent follows its documented default latch map, with sustain velocities capped at 116 to stay clear of its rake and pinch zones. The DjinnBass subset is cross-checked against a community map; verify both against your own patch.

  • Software scheduling. An 8 ms foreground timer sends timestamped MIDI within a 25 ms horizon; every future note waits in a queue the app owns, so mute and Panic cancel its own notes and nothing else. It never calls MIDIOutput.clear(), which some MIDI bridges break.
  • MIDI clock out. 24 PPQN, Song Position and Start with the band, Stop on Stop, following the tempo continuously, to the band's port or a separate one your DAW syncs to.
  • Your feet are controllers. Spare pads, a keyboard or a foot controller can trigger any of the named performance actions (transport, tap and target tempo, lock, half and double time, styles, lane mutes and velocities, melody, sections): pick the action, hit the pad, save. Learning never runs an action, overlapping triggers are refused, and only the performance registry is bindable: no imports, resets or permission grants.

Limits

A rhythm partner that keeps playing when it shouldn't is worse than none. Drums stops its output when the tab is hidden, a device disconnects or its timer stalls for more than 180 ms, and after two silent bars in Follow mode; a fresh Start is always needed, and nothing is ever replayed. Silence alone never stops the band in Fixed tempo: resting parts keep their last usable pattern.

Bounded everything
Owned MIDI notes32Recent hits128
Preview voices64Timing samples256
Control bindings64Queued commands32
Harmonic context8–9 barsImported settings128 KiB

Stop and Panic release only notes this tab owns, keyswitches included; there is no global All Sound Off, MIDI thru or sysex, and same-named input and output ports are refused to avoid feedback. Kit maps, racks, profiles and bindings live in the browser's local storage, move between browsers as one validated JSON file, and never leave the machine.

Connect a kit

  1. Open Drums in Chrome or Edge. Web MIDI needs a secure page, which the published app is.
  2. Setup → MIDI. Connect, choose the kit as input and a separate output port: a loopMIDI port on Windows, the IAC bus on macOS.
  3. Load instruments in the DAW on that port, monitoring channel 1 for bass, 2 for chords and 3 for the pulse (or whatever your rack uses).
  4. Map the kit. General MIDI kits work as they are; Learn kit step by step captures one pad at a time for anything else.
  5. Start. Follow kit waits for your first hit; Fixed tempo plays at the target BPM. Keep a steady anchor (hats, or kick and snare) while confidence builds.