An online beat maker is a browser-based drum sequencer that turns clicked cells on a fixed grid into a looping synthesized pattern, and the Online Drum Machine delivers that experience through a 16-step layout with three voices — kick, snare, and hi-hat — plus a tempo control that accepts whole numbers from 40 to 240 BPM. The grid is always one bar of music: four quarter-note beats divided into sixteen equal sixteenth-note steps, where each step lasts 60 ÷ BPM ÷ 4 seconds. At 120 BPM that works out to 0.125 seconds per step and a full 2-second bar, which is exactly how the default four-on-the-floor example loops when you press Play. Unlike downloadable production software, an online beat maker needs no account, no install, and no audio files, because the kick, snare, and hi-hat are generated at playback time through the browser's Web Audio API. That combination of a fixed 16-step grid, a single tempo input, and three synthesized voices is the entire mental model you need before you click anything.
What an Online Beat Maker Actually Does
An "online" beat maker runs entirely inside the page you already have open. The grid, the tempo box, and the playback controls are regular HTML elements, and the audio you hear is produced by browser-level Web Audio nodes that synthesize each hit on demand. Nothing is sent to a server for processing, so you do not upload a recording to use the tool, and nothing is fetched from a sample library when the page first loads. That is why a beat maker online can also be described as a local 16-step sequencer: the work happens on your machine, using only the audio engine that already ships with every modern browser.
This matters for three practical reasons. First, there is no account, no sign-up step, and no waiting for a render job to finish. Second, because the voices are generated locally, the tool cannot inherit a third-party sample license, and the kick, snare, and hi-hat will not stop working because a sample host went offline. Third, every hit is reproducible from a small set of Web Audio primitives — an oscillator for the kick, a freshly generated noise buffer for the snare, and a shorter noise burst for the hi-hat — which is why the same pattern can sound slightly different across browsers, output hardware, and sample rates.
The 16-Step Grid and the Bar
The grid is the heart of the tool. Three horizontal rows are labeled for the three voices: kick, snare, and hi-hat. Sixteen columns span one bar of music, divided into four beats of four sixteenth-note steps each. That means every row is a 16-cell boolean array, and the whole pattern is a validated record of three unique tracks containing exactly sixteen booleans each — 48 on or off decisions in total.
When you click any cell, that instrument is toggled on or off for the corresponding sixteenth-note step. The step outline moves across the bar while the pattern plays, so you always see which of the sixteen positions is sounding right now. The first time you open the tool, the grid is pre-loaded with a simple four-on-the-floor starter: kick on every quarter-note position, snare on beats two and four, and a closed hi-hat on every eighth-note position. That starting pattern is only a default and can be replaced one cell at a time. If you want silence, the Clear pattern control turns every one of the 48 cells off so you can begin fresh.
For accessibility, each grid button exposes its own on or off pressed state and a descriptive label, the moving step indicator uses only color and an outline, and color transitions are disabled when a reduced-motion preference is set. Horizontal scrolling keeps all sixteen steps usable on narrow screens without shrinking the touch targets into unreadable marks.
How BPM Becomes Step Duration
Tempo in this tool follows the MusicXML definition, where BPM means quarter notes per minute. Because the grid is four sixteenth-note steps per quarter note, every step lasts 60 ÷ BPM ÷ 4 seconds. This is the same relationship referenced in the MusicXML 4.0 sound element, so the math is not invented for this tool — it is the standard way to convert a tempo marking into a step clock.
Working through one number end to end: at 120 BPM a quarter note lasts 60 ÷ 120 = 0.5 seconds, so a sixteenth-note step lasts 0.5 ÷ 4 = 0.125 seconds, and the full 16-step bar lasts 0.125 × 16 = 2.0 seconds. That is the timing the scheduler uses, and it is also how long the default four-on-the-floor pattern takes to wrap around once.
| Tempo (BPM) | Step duration | Bar duration (16 steps) |
|---|---|---|
| 40 (lower boundary) | 0.375 seconds | 6.0 seconds |
| 120 (default) | 0.125 seconds | 2.0 seconds |
| 240 (upper boundary) | 0.0625 seconds | 1.0 second |
These three rows are officially defined anchors: 40 BPM is the lower usability boundary, 120 BPM is the default, and 240 BPM is the upper boundary. The 40 to 240 range is a deliberate usability and scheduling guard for this focused tool, not a claim about the limits of musical tempo. Faster or slower patterns belong in a dedicated music application.
Build and Play a 16-Step Beat
- Set the tempo. Enter a whole-number BPM from 40 to 240 in the tempo box. The input is strict — empty values, decimal fractions, signs, exponent notation, unit text, and numbers outside the range each surface a recoverable error message, but they do not break the tool. A valid value is required before Play will start cleanly at step one.
- Toggle cells across the three tracks. Click any of the 48 grid cells (three rows × sixteen columns) to switch that kick, snare, or hi-hat step on or off. The initial four-on-the-floor example is a starting point — replace it one cell at a time, or press Clear pattern to turn every cell off and begin with silence.
- Press Play, then Stop when you are done. Play loops the synthesized beat using the scheduler described below. Stop releases playback resources, clears the scheduling timer, stops and disconnects the tracked audio sources, and closes the current AudioContext so a fresh Play press can build a new one. You can edit pattern cells during playback; the changes are read by the upcoming scheduling window.
How the Three Voices Are Synthesized
All three sounds are produced at playback time from browser Web Audio nodes — there are no downloaded samples, so opening the tool does not contact a sample host. The kick is a short sine oscillator whose frequency drops rapidly while its gain decays, giving the familiar low-end thump. The snare is built from a freshly generated noise buffer shaped by a high-pass filter and a gain envelope, which is why every snare hit is a different realization of noise. The hi-hat uses a shorter, quieter noise burst with a higher high-pass cutoff, so it sits above the snare in the mix.
These are intentionally simple synthetic voices rather than recordings of physical drums. Their exact tone can shift slightly with browser audio implementation, output hardware, sample rate, and the random noise generated for each snare or hi-hat hit. That is the price of having zero sample files: the tool is fully local, but it is not a sample-identical drum machine across devices. If you need rendered stems or sample-accurate output, transfer the pattern concept to a dedicated music application.
Tempo Input Rules and Playback Behavior
The tempo field accepts only whole decimal numbers from 40 through 240. Empty input, decimal fractions like 119.5, signed values, exponent notation, unit text such as "120 bpm," and any value outside the range each produce a recoverable error so you can correct the entry without losing state. Editing the tempo while a pattern is playing is a deliberate stop: the current run ends and its audio context is released, which prevents already scheduled events at the old tempo from overlapping a freshly scheduled run at the new tempo. Pressing Play after entering a valid value restarts cleanly at step one.
Internally, playback uses a look-ahead scheduler. A lightweight browser timer checks every 25 milliseconds and places the next events up to 100 milliseconds ahead on the AudioContext timeline. The audible sources use their exact scheduled Web Audio start times rather than treating JavaScript timer callbacks as the beat clock, which reduces ordinary main-thread timing jitter. The shared pure scheduling logic builds deterministic step numbers, timestamps, and active-track snapshots, and the same pattern and timing functions are used in production playback and in tests covering eight tempo anchors, the 16-step wraparound, exact event offsets, initial pattern locations, immutable toggling, clearing, malformed tempo values, and structural invariants for three tracks of sixteen booleans.
What the Online Drum Machine Does Not Do
Explaining what a beat maker online includes is only half the picture; the limits matter just as much. The tool is built for sketching straight sixteenth-note ideas, learning step sequencing, and testing a basic pulse, and the following capabilities are intentionally outside its scope:
- Swing, triplets, velocity, and per-track accents or volume
- Recording, export, or rendered audio files
- MIDI input or output, and external synchronization
- Arbitrary time signatures beyond the single 4/4 bar
- Effects, processing, and per-track EQ
- Background-tab guarantees, sample-accurate cross-device rendering, and latency calibration
It is also worth knowing that heavy browser throttling, suspended tabs, device changes, and high system load can still affect what you hear, because the scheduler runs in your browser rather than on dedicated audio hardware. If any of those features is essential to your task, this tool should be used for the early idea stage, and the pattern should be re-built inside a DAW or dedicated sequencer for final production.
When to Use It (and When to Move On)
An online beat maker fits three specific jobs. The first is sketching a rhythm idea before you commit to a heavier project — opening a tab, toggling cells, and hearing the loop is faster than launching a full DAW. The second is learning how step sequencing works: every concept you need, from cells to BPM to bar length to playback, sits on one screen with no menus to navigate. The third is testing a basic pulse for a lesson, a metronome-style reference, or a quick tempo sanity check.
It is not the right tool for production arrangement, rendered stems, MIDI synchronization with hardware, exact inter-device synchronization, or latency calibration. For those tasks, transfer the pattern concept — the three tracks, the 16 cells, the BPM math — to a dedicated music application. The Online Drum Machine gives you a fast, local way to think in sixteenth notes; it does not try to replace an audio workstation. Keep your device volume moderate before pressing Play, especially with headphones, because synthesized transients can sound louder on some output systems.