A virtual drum kit for MIDI, explained
This free virtual drum kit turns your browser into a drum sound module. Connect an electronic drum kit or a MIDI pad controller and every hit plays a drum or cymbal on screen, with the dynamics of your playing. It uses the Web MIDI API to read your controller and the Web Audio API to play the sounds, so nothing is installed and nothing is uploaded. All 20 sounds in the five kits are synthesised in your browser when the page loads.
How do I connect my electronic drum kit?
Most modern e-drum modules are class-compliant USB-MIDI devices: plug the USB cable into your computer and they work without a driver. Older kits with a 5-pin MIDI OUT socket need a USB-MIDI interface. Open this page in Chrome, Edge, Opera or Firefox, press Connect MIDI and allow access when the browser asks. The device name appears under the MIDI setup tab. Close other programs that use the kit (a DAW or the maker's app) if it does not show up, because on Windows a MIDI device can often be used by only one program at a time.
Which preset should I choose?
The page reads the device name and picks a preset for Roland modules and common pad controllers. You can change it at any time.
| Preset | For | What it adds |
|---|
| General MIDI | Alesis, Yamaha DTX, most budget kits | Standard GM drum notes: 36 kick, 38 snare, 42/46 hi-hat, 49 crash, 51 ride |
| Roland V-Drums | TD-02 up to TD-50 | Rim and edge notes: 40 rimshot, 22/26 hi-hat edge, 55/52 crash edges, 59 ride edge, 58 floor tom rim |
| Pad controller | MPD, Launchpad, MPC, nanoPAD | 16 pads from C1 (36) laid out as a kit: kick and snare bottom left, cymbals on the top row |
| Custom | Anything else | Your own mapping made with Learn, saved in this browser and as a JSON file |
How does the hi-hat pedal work?
An e-drum hi-hat sends two kinds of messages. A hit on the cymbal is a note, and the pedal position is a controller change on CC4, from 0 to 127. The virtual kit follows CC4: with the pedal up a hit sounds open, half pressed it sounds half-open and with the pedal down it sounds closed. Closing the pedal also cuts off a ringing open hi-hat, and on most kits a firm pedal press sends note 44, which plays the pedal "chick". If your hi-hat works backwards, tick invert hi-hat pedal in the Mixer & feel tab.
Does it respond to velocity and cymbal chokes?
Yes. MIDI velocity runs from 1 to 127 and changes both the volume and the brightness of every sound, so a soft ghost note on the snare sounds darker than a full backbeat. Four velocity curves let you match the feel of your pads: soft for light players, hard for more control at the top, fixed for a pad controller without dynamics. A cymbal choke (grabbing the edge) arrives as polyphonic aftertouch and stops the cymbal, just like on the module. Weak hits from crosstalk between pads can be ignored with the threshold slider.
What does the MIDI monitor show?
The MIDI monitor tab is a MIDI tester for your kit. Every incoming message is listed with the time, type, channel, note number and name, velocity and the sound it plays. Unmapped notes are shown in red. Use it to find out which note a pad sends, to see if the hi-hat pedal sends CC4, or to check for double triggers and crosstalk. The mapping table also counts the hits per pad and shows the last velocity, which helps when you set the sensitivity on your drum module.
What about latency?
The time between a hit and the sound is the delay of the drum module, the USB connection, the browser and your audio output added up. With wired headphones or speakers on the computer this is usually low enough to play comfortably; the monitor tab shows the browser's own output latency. Bluetooth headphones add 100 to 300 ms and make drumming hard, so use a cable. On Windows, a USB audio interface often has a lower latency than the built-in sound card.
Recording and exporting
Press ● Rec: recording starts on your first hit, so there is no silence at the start. With the click (metronome) on, recording starts on beat one instead, and the MIDI file lines up with the bar lines in your DAW. Every hit is stored with its exact time and velocity. Export the take as a Standard MIDI File with General MIDI drum notes on channel 10, ready for a drum track in Ableton Live, Logic, FL Studio, Cubase, Reaper or GarageBand, or as a 16-bit WAV file rendered with the kit, mixer and room you chose.
The five kits
- Studio acoustic: a tight, natural kit for practice and most styles.
- Big rock: deeper toms, a fat snare and longer cymbals.
- TR-808 style: the long boomy kick, snappy snare and metallic hats of the classic drum machine.
- TR-909 style: punchy house and techno drums.
- Lo-fi: the studio kit through a crunchy, bit-reduced filter for beats and hip-hop.
Does it work on a phone or tablet?
Yes, with touch: switch to the Pads view for big pads and play with several fingers at once. Android with Chrome also supports USB-MIDI controllers through an OTG adapter. Safari on iPhone and iPad does not support Web MIDI, so there you play with touch only.
More music tools
Program your own beats with the Drum Loop Studio drum machine, play along with the Drum Pad Looper, keep time with the metronome and BPM counter, or play a MIDI keyboard on the online virtual piano. Everything is listed on the music tools page.