Online Drum Machine

How the Drum Machine works

Online drum machine: reading the grid

Each row is one drum and each column is a sixteenth note, so the sixteen columns make one bar of 4/4. Columns 1, 5, 9 and 13 are the four beats and are drawn with a brighter border to keep you oriented; the columns between them are the off-beats and the sixteenths. A lit square plays that drum on that step. While the sequencer runs, a highlight sweeps along the columns so you can see where in the bar you are. Clicking a square while the beat plays takes effect on the next pass through that column, which is the usual way to build a pattern up: get the kick going, then lay hats over it, then find where the snare wants to sit.

The presets

Four on the floor is the house and disco backbone, a kick on every beat with a snare on two and four and hats on the eighths. Hip hop uses a sparser, syncopated kick with the snare on two and four and a clap doubling it. Breakbeat pushes the snare off the beat and adds a tom fill at the end of the bar. They are starting points rather than finished grooves, and the quickest way to learn what each instrument does is to load one, clear a row and rebuild it.

Tempo and swing

Tempo is in beats per minute, so at 110 BPM a bar of four beats lasts 2.18 seconds and each sixteenth is 136 milliseconds; the rail shows the bar length as you move the slider. Swing delays every second sixteenth note by a fraction of the gap to the next one. Zero is perfectly straight, around 20 to 30 percent is a light shuffle, and beyond 50 percent the off-beats sit almost on triplets. Swing is what makes the same grid sound stiff in one genre and loose in another, so try it on the hip hop preset.

The sounds

The kick and tom are pitched membranes with a fast downward pitch sweep, the snare is a burst of white noise with a short tone underneath, the hats are noise through a high-pass filter with a short and a longer decay, and the clap is pink noise through a band-pass. They are deliberately simple electronic drums in the style of an early drum machine rather than recordings of a kit. Because they are generated, the page is tiny and works offline once it has loaded.

Keeping a pattern

Copy pattern puts the grid on the clipboard as six lines of x and dot characters, one per drum, which is easy to paste into a note or a message and read back later. There is no export to audio here; the browser audio recorder on this site can capture the output if you need a file.

Related tools