An online drum machine built for sketching is generally not designed to export, record, add swing, or synchronize MIDI, and the Online Drum Machine on Lizely is no exception, keeping its scope to a straight 16-step loop of synthesized kick, snare, and hi-hat. The tool runs entirely in the browser using Web Audio, generates every sound at playback time, and exposes a deliberately small set of interactions: enter a whole-number tempo, toggle cells, press Play, press Stop, and press Clear pattern. There is no save file, no WAV render button, no audio recording layer, no swing slider, no per-step velocity, and no MIDI input or output. Treating the tool as a quick sketchpad rather than a finisher is the honest way to frame expectations before opening the page, because every feature that would let the loop leave the browser or talk to external gear was intentionally left out. Knowing that early saves time, because it tells you when to move the pattern idea into a dedicated music application instead of hunting for a button that will never appear.

What an Online Drum Machine Is Built For
For the Online Drum Machine on Lizely, the answer to that question is no across the board. The page describes itself as a compact 16-step rhythm sequencer that runs entirely in the browser, and that single sentence defines its entire reason for existing. It is meant to help you sketch a straight sixteenth-note idea, learn how step sequencing lays a beat on a grid, or test whether a basic pulse feels right at a chosen tempo.
Three tracks are exposed, kick, snare, and closed hi-hat, across a fixed grid of sixteen steps that represent four quarter notes divided into sixteenth-note sub-steps. Every sound is synthesized at playback time, so the kick is a short sine oscillator whose pitch and gain decay quickly, the snare is a freshly generated noise buffer shaped by a high-pass filter, and the hi-hat is a shorter, quieter noise burst with a higher cutoff. None of these voices are recordings of physical drums, and no sample library is downloaded or uploaded at any point.
Because the tool lives entirely in a browser tab and was built around Web Audio, the surface area stays intentionally small. There is no project file, no stem export, no take recorder, and no clock distribution to a DAW. The point is to be ready in one click, with no sign-up, no installation, and no network fetch beyond the page itself.
Why Export, Recording, Swing, and MIDI Are Out of Scope
Each feature named in the question would have changed the tool from a sketchpad into a small studio, and the contract behind the Online Drum Machine explicitly rules them out. Recording and export would require capturing the live AudioContext output to a downloadable file, which would mean keeping a long-running buffer in memory and writing a WAV encoder. That work was deliberately skipped so the page stays light and the playback engine stays focused on a single scheduling loop.
Swing is missing for a structural reason. Swing in step sequencers is implemented by stretching every other sixteenth note past the strict grid, often as a percentage offset that delays even-numbered steps. The Online Drum Machine grid is fixed to four sixteenth steps per quarter note with no per-step timing variables, and the scheduling window is built on the assumption that every step is exactly 60 divided by BPM divided by 4 seconds long. Adding swing would mean rewriting both the step math and the shared scheduling functions, which would break the deterministic step numbers, timestamps, and active-track snapshots the tool tests against.
MIDI synchronization is also out of scope. The Web Audio API exposes the AudioContext clock, but the tool does not send or receive MIDI messages, route MIDI clock, or lock to an external tempo source. There is no Web MIDI hookup, no virtual port, and no way to slave the sequencer to a hardware controller or push Transport messages to a DAW. The look-ahead scheduler that places events on the AudioContext timeline is internal-only.
The result is a tool whose features you can list in one line. Anyone looking for production finishing, sample-accurate sync across devices, or a saved project should plan to rebuild the pattern idea elsewhere rather than wait for those buttons to appear.
How to Build a Beat in the Online Drum Machine
Here is the full workflow the tool actually supports, in the order you would use it from a blank tab.
- Open the Online Drum Machine in a current browser. No account, no upload, and no sample download is required before you start.
- Enter a whole-number tempo in the tempo field, choosing any value from 40 to 240 BPM. The field rejects empty entries, decimal fractions, signs, exponent notation, unit text, and values outside the range, so input is strict.
- Toggle kick, snare, and hi-hat cells across the sixteen-step grid to build your pattern. Each click flips that instrument on or off for the corresponding sixteenth-note step, and the grid always represents four quarter-note beats divided into sixteen equal sub-steps.
- Press Play to start looping the synthesized beat. The AudioContext is created only after this press, which respects browsers that require a user gesture before audio starts. A moving step outline shows the current position while the rhythm loops.
- Edit the pattern while it is playing. Toggle changes are read by the next scheduling window and applied at the correct grid position without restarting.
- Press Stop to release audio. The scheduling timer is cleared, all tracked source nodes are stopped and disconnected, and the AudioContext is closed.
- Press Clear pattern to turn every one of the 48 cells off. The grid returns to silence so you can start a fresh idea without reloading the page.
The default pattern that loads first is a four-on-the-floor example: kick on quarter-note positions, snare on beats two and four, and closed hi-hat on eighth-note positions. It is a starting point, not a restriction, and you can replace any cell one at a time.
The Tempo Math Behind Every Step
BPM in this tool means quarter notes per minute, the same convention used by MusicXML for tempo, where a sound element sets the number of quarter notes per minute. A quarter note therefore lasts 60 divided by BPM seconds, and each sixteenth-note step lasts one quarter of that, which gives the formula 60 divided by BPM divided by 4 seconds per step.
Worked example at 120 BPM:
- Quarter note duration: 60 divided by 120 = 0.5 seconds.
- Sixteenth note step: 0.5 divided by 4 = 0.125 seconds.
- Full 16-step bar: 0.125 multiplied by 16 = 2 seconds.
The table below lists the step and bar durations at the boundary and middle tempos. These come straight from the formula, and the four endpoints match the values disclosed in the tool's own tempo anchors.
| BPM | Step duration (60 / BPM / 4) | 16-step bar |
|---|---|---|
| 40 | 0.375 s | 6.000 s |
| 60 | 0.250 s | 4.000 s |
| 120 | 0.125 s | 2.000 s |
| 180 | 0.0833 s | 1.333 s |
| 240 | 0.0625 s | 1.000 s |
Two practical consequences fall out of that math. First, every tempo change while playing stops the current run and releases the AudioContext, because letting scheduled events at one tempo overlap a new scheduler would mix two clocks. Enter a valid whole number from 40 to 240 and press Play again for a clean start at step one. Second, the tempo range is a deliberate usability and scheduling guard, not a claim about what music can do. If you need a tempo outside that window, the tool is not the right sketchpad for those features.
What You Can and Cannot Change During Playback
The boundary between editable and fixed is narrow, and it helps to list it explicitly. During playback you can toggle any kick, snare, or hi-hat cell, and the scheduling window reads the new active-track snapshot before placing the next events, so edits land cleanly on the grid. The moving step outline keeps color and outline only, and color transitions are disabled when reduced-motion is requested, which makes the visible state predictable on every device.
You cannot change the tempo without restarting. Entering a new value stops playback, releases the AudioContext, and waits for the next Play press. You cannot change the time signature, because the grid is fixed at four quarter notes. You cannot add per-step velocity or accents, because every trigger fires at the same envelope shape. You cannot enable swing, triplets, or per-track volume. You cannot record what you hear or export a WAV file. You cannot route MIDI in or out, and there is no background-tab guarantee, because throttled tabs can drop scheduling precision.
If a Play attempt fails because the browser blocks audio initialization, the tool surfaces a recoverable message and lets you try again rather than pretending playback succeeded. Stop, restart, playback error, and component unmount all clear the timer, stop and disconnect tracked source nodes, and close the AudioContext, so the page does not leak audio resources between attempts.
When to Move a Pattern to a Dedicated Music App
When the sketch becomes something you want to keep, the Online Drum Machine is meant to be left behind. Its output is the idea in your head plus whatever pattern you left on the grid, not a saved file. Recreating that pattern inside a full music application is the supported way to extend the work, and the same step-and-tempo approach transfers directly.
For background counting without a beat, a companion Online Metronome runs accented clicks from 30 to 240 BPM with one to twelve beats per measure, which is a useful reference while you decide whether a new tempo range is what you actually need. For deeper scheduling detail and the math behind step timing, the BPM math and scheduling guide explains the same 60 divided by BPM divided by 4 relationship in more depth. For the formal definition of tempo, the W3C MusicXML 4.0 sound element is the specification the tool follows, while the W3C Web Audio API 1.1 document defines the oscillator and noise nodes that produce the synthesized voices.
The honest framing is that an online drum machine in the lightweight class is a sketchpad, not a producer. Export, recording, swing, velocity, effects, and MIDI synchronization all belong to the next step, and reaching for a dedicated application early keeps the sketch honest.
For a deeper look, see Online Drum Machine: How Drum Sounds Are Made in Browser.