Online Beat Maker – 16-Step Drum Machine
Program drum patterns with kick, snare, hi-hats, and bass in a browser-based 16-step sequencer. Adjust tempo, swing and volume, save patterns, and export JSON presets — all running locally with the Web Audio API.
Creative & fun
Online Beat Maker – 16-Step Drum Machine
Tap out a pattern for kick, snare, hi-hats and bass, then loop it at any tempo using the Web Audio API. Everything runs locally in your browser.
Patterns & export
{
"name": "Untitled pattern",
"bpm": 120,
"swingPercent": 0,
"grid": {
"kick": [
true,
false,
false,
false,
true,
false,
false,
false,
true,
false,
false,
false,
true,
false,
false,
false
],
"snare": [
false,
false,
false,
false,
true,
false,
false,
false,
false,
false,
false,
false,
true,
false,
false,
false
],
"hihat": [
false,
false,
true,
false,
true,
false,
true,
false,
true,
false,
true,
false,
true,
false,
true,
false
],
"bass": [
true,
false,
false,
false,
false,
false,
false,
true,
false,
false,
false,
false,
true,
false,
false,
false
]
},
"createdAt": "2025-11-26T07:40:09.384Z"
}Kick: X---X---X---X--- Snare: |---X---|---X--- Hi-hat: |-x-X-x-X-x-X-x- Bass: X---|--x|---X---
Audio runs locally in your browser
This web audio beat maker does not upload or record your patterns. Everything is synthesized on your device using the Web Audio API and saved locally in your browser's storage.
How to use the 16-step drum machine
This online drum machine is built around a classic 16-step sequencer. Time is divided into sixteen equal slices, and each row represents a sound: kick, snare, closed hi-hat, and a short synth bass tone. To create a beat, tap the pads in the grid to turn individual steps on or off. When you press play, the sequencer loops from left to right, triggering any active steps in time with the selected tempo.
You can start with a simple pattern by placing kicks on steps 1 and 9, snares on steps 5 and 13, and hi-hats on every second or fourth step. Then add bass notes on steps that feel good against the drums. Use the BPM controls to slow things down for a chill groove or speed them up for faster electronic rhythms. The play button starts and stops the loop instantly, making it easy to experiment in real time.
What is a step sequencer?
A step sequencer is a way to program rhythms and melodies by dividing time into fixed steps instead of recording live performance. Each column in the grid is one step, usually a sixteenth note at common dance tempos. By toggling steps on and off, you can quickly sketch patterns that would be difficult to play by hand with perfect timing. Many classic drum machines and grooveboxes used simple 16-step layouts like this, which makes the interface familiar and fast to learn.
The swing control slightly delays every second step to give the groove a more human, shuffled feel instead of a rigid machine feel. At 0% swing, the beat is completely straight; as you increase swing, the off-beat hi-hats and snares lean later in the bar, creating a more laid-back pocket that is common in hip-hop and house music.
Kick, snare, hi-hat, and bass explained
In most drum patterns, the kick anchors the low end and marks the main beats. The snare usually lands on the second and fourth beats of each bar, giving the groove its backbeat. The hi-hat fills in the subdivisions and defines how busy or sparse the rhythm feels. Thebass in this tool is a short synth note that you can use to outline a simple bassline or reinforce the kick.
Combining these four elements, you can build everything from minimal techno patterns to boom-bap, lo-fi hip-hop, or pop drum grooves. The step sequencer makes it easy to see which sounds land together and which are offset, which helps you understand how drum parts interlock to create a full beat.
Why browser-based beat makers are great for sketching ideas
Because this web audio beat maker runs entirely in your browser, there is nothing to install and no account required. All sound is generated locally using the Web Audio API, and your patterns are stored in your own localStorage, not on a server. You can save multiple presets, reload them later, and export a JSON file that captures the grid and tempo in a portable format.
Browser-based tools are ideal for quick sketches: you can open this page, make beats in seconds, and then recreate the pattern in your main DAW or hardware later. Use it to audition groove ideas, practice counting sixteenth notes, or just have fun tapping out rhythms with a simple 16 step sequencer that responds instantly to your clicks and taps.