Free Online Drum Machine

16-step sequencer with 8 synthesized drum sounds. Build beats with preset patterns, adjust swing and volume per instrument, and save or export your patterns. All sounds are generated with Web Audio, no samples needed.

11 min read

How This Drum Machine Compares

With synthesized sounds, swing control, per-instrument volume, and pattern export, this drum machine provides a more complete beat-making experience than most browser-based alternatives.

Drum Programming Basics

This video covers the fundamentals of programming drum patterns. Use the sequencer above to practice creating the patterns discussed in the tutorial.

to the Online Drum Machine

Programming drum beats is one of the most fundamental skills in music production. Whether you are making hip-hop, electronic dance music, rock, or jazz, the drums provide the rhythmic foundation that everything else is upon. This online drum machine gives you a 16-step sequencer with 8 synthesized drum sounds, everything you create beats in any genre without installing software or buying hardware.

The sequencer grid works like a timeline. Each row represents one drum sound, and each column represents one sixteenth note in a single measure of 4/4 time. The 16 columns divide one measure into 16 equal steps. Steps 1, 5, 9, and 13 fall on the quarter-note beats (1, 2, 3, 4). Steps 3, 7, 11, and 15 fall on the eighth-note "ands" between the beats. The remaining steps are the sixteenth-note subdivisions that fill in the gaps.

Drum Sound Synthesis

All eight drum sounds in this machine are synthesized in real time using the Web Audio API. No audio samples are loaded or downloaded, which means the tool works instantly and uses minimal bandwidth.

The kick drum is created with a sine oscillator that sweeps rapidly from a high frequency (around 150 Hz) down to a low frequency (around 40 Hz). This downward pitch sweep, combined with a short amplitude envelope, produces the deep thump characteristic of an electronic kick. The initial high-frequency transient gives the attack its punch, while the low-frequency body provides the weight.

The snare drum combines two elements: a triangle wave oscillator at around 200 Hz for the body, and a noise source filtered through a highpass filter for the snappy rattle. The noise component simulates the sound of snare wires buzzing against the bottom drumhead. By adjusting the balance between the tone and noise components, you can create snares ranging from tight and cracky to loose and splashy.

Hi-hats (both closed and open) use filtered white noise. The closed hi-hat has a very short decay (around 50 milliseconds), giving it a tight, clipped sound. The open hi-hat has a longer decay (around 300 milliseconds), letting the noise ring out. A bandpass filter centered around 10 kHz gives both hi-hats their metallic character. The clap uses shaped noise bursts. The toms use sine waves with pitch sweeps at different frequencies for high and low variations. The crash cymbal uses noise with a longer decay and wider frequency range than the hi-hats.

Building Basic Patterns

The most common starting point for any beat is the kick and snare pattern. In rock and pop music, the kick typically falls on beats 1 and 3 (steps 1 and 9), and the snare falls on beats 2 and 4 (steps 5 and 13). This creates the fundamental boom-bap backbeat that drives most Western popular music. Try loading the Rock preset to hear this pattern.

Once you have the kick and snare in place, add hi-hats to fill in the rhythm. Eighth-note hi-hats (every other step: 1, 3, 5, 7, 9, 11, 13, 15) are the most common starting point. For a busier feel, use sixteenth-note hi-hats (every step). For a more relaxed groove, use quarter-note hi-hats (steps 1, 5, 9, 13) and let the spaces breathe.

Hip-hop beats often use a different kick pattern with more syncopation. Instead of straight beats 1 and 3, try kick on steps 1, 4, 7, and 11 for a bouncy, off-kilter feel. The Hip-hop preset demonstrates this approach. Adding swing shifts the off-beat hi-hats slightly late, creating the relaxed, behind-the-beat feel that characterizes many hip-hop grooves.

Understanding Swing

Swing (sometimes called shuffle) alters the timing of notes that fall between the main beats. In a perfectly straight pattern, all 16 steps are evenly spaced. When you add swing, every other step (the even-numbered ones: 2, 4, 6, 8, etc.) is delayed. The amount of delay is controlled by the swing percentage. At 0%, there is no swing and the timing is perfectly metronomic. At around 30-40%, you get a noticeable shuffle feel. At 50%, the timing approaches a triplet feel where the off-beats land two-thirds of the way through each beat rather than halfway.

Different genres use different amounts of swing. Jazz typically uses heavy swing (40-50%). Funk and soul use moderate swing (20-30%). House music sometimes uses light swing (10-15%) for a subtle groove. Rock and metal usually use no swing at all for a tight, aggressive feel. Experiment with the swing control while a pattern is playing to hear how it changes the character of the beat.

Per-Instrument Volume

The volume slider on each row controls the relative loudness of that instrument. This is important for creating a balanced mix. In most genres, the kick and snare are the loudest elements, while hi-hats sit slightly lower. Ghost notes (quiet hits used for texture, especially on snare and hi-hat) can be simulated by automating volume levels, but the simplest approach is to set a comfortable balance and let the pattern do the talking.

Saving and Exporting

The Save Pattern button stores your current grid state, BPM, and swing setting in localStorage. This persists between browser sessions, so you can close the tab and come back later to find your pattern waiting. The Load Pattern button restores the last saved state. The Export JSON button downloads a JSON file containing the complete pattern data, which you can share with others or import into other tools that accept JSON pattern data.

From Patterns to Full Arrangements

A single 16-step pattern is the building block of a full drum arrangement. In a complete song, you typically have several different patterns: a verse pattern, a chorus pattern (often busier), a bridge pattern, and fills (short bursts of activity that transition between sections). Start by creating your main groove, then modify it for different sections. For a fill, try adding extra kick and snare hits on the last four steps (13-16) of a pattern before the next section starts.

The preset patterns provide starting points for genre-specific grooves. Load a preset, then modify it by adding or removing hits to make it your own. The best way to learn drum programming is to study patterns from songs you know and recreate them step by step. Listen to the kick pattern, program it, then add the snare, then the hi-hats, and finally any extra percussion.

Related Stack Overflow Discussions

Hacker News Discussions

Browser Compatibility

Data from caniuse.com/audio-api

Related Tools

Frequently Asked Questions

March 19, 2026

March 19, 2026 by Michael Lip

March 19, 2026

March 19, 2026 by Michael Lip

Last updated: March 19, 2026

Last verified working: March 20, 2026 by Michael Lip