Metronome
A metronome that keeps time the way a hardware one does. Each click is booked a tenth of a second ahead on your browser's audio clock instead of being fired by a page timer, and every beat time is worked out from the beat before it, so the pulse does not slip when the page is busy. Tempo from 20 to 300, bars of two to seven beats, subdivisions down to sixteenths, tap tempo, and three click sounds with the downbeat set a higher pitch. Everything runs in your browser.
Allegro · 4/4beats per minute
Stopped. Press Start, or the space bar, to hear 120 beats per minute.
- Web Audio look-ahead scheduler: 100 ms window, 25 ms tick, beat times accumulated
- Tap the button, or press T, at least twice. The last 8 gaps between taps are averaged.
- A short burst of noise through a narrow filter, the sound of a mechanical metronome's escapement.
- Space start and stop ↑ ↓ one bpm ← → five bpm T tap
The shortcuts wake up once you have clicked or tabbed into the tool, and only while the metronome is on screen. Until then the space bar and the arrow keys scroll the page, the way they do everywhere else.
Tempo markings
The Italian markings and the beats per minute usually printed against them. They are a naming convention, not a measurement: composers used these words for two centuries before anyone attached numbers, and editions place the boundaries a few beats apart. The row matching your tempo is highlighted.
| Marking | Beats per minute | Feel |
|---|---|---|
| Largo | 40 to 59 | very slow, broad |
| Larghetto | 60 to 65 | slow, a shade lighter than largo |
| Adagio | 66 to 75 | slow, at ease |
| Andante | 76 to 107 | walking pace |
| Moderato | 108 to 119 | moderate |
| Allegro | 120 to 167 | fast, bright |
| Vivace | 168 to 175 | lively |
| Presto | 176 to 199 | very fast |
| Prestissimo | 200 and up | as fast as it will go |
setInterval is not a metronome. A page timer fires late whenever the browser is busy, and the lateness accumulates, so a click driven by one is audibly behind after a few minutes. This schedules each click a tenth of a second ahead on the audio hardware's own clock, the technique browser sequencers use, and each beat time is worked out from the beat before it rather than from a fresh clock reading. That is what puts the beats 0.5000 seconds apart at 120 bpm and keeps them there. If the page is ever starved for longer than the look-ahead window, the beats that were lost are counted and shown rather than played late.
Accuracy. Beats are scheduled on the audio hardware clock a tenth of a second ahead, the method used by browser sequencers, so the pulse does not drift when the page is busy. Tap tempo averages your last eight taps. Below 20 and above 300 beats per minute is outside what this plays, and tapping cannot set anything slower than 30, because a gap over two seconds is read as a pause. Type those tempos instead.
Common questions
- Why does this metronome not drift?
- Because nothing about the timing depends on the page. The obvious way to write a metronome is setInterval, and a page timer is only a request: the browser fires it when it next gets round to it, which is late whenever the page is doing anything else, and every late firing pushes the next one later still. Here a 25 ms interval only wakes up, asks the audio hardware what time it is, and books every beat falling inside the next 100 ms directly on the audio clock, which plays them sample-accurately whatever the page is doing. Each beat time is added to the one before it rather than read back from the clock, so a scheduling delay can never be baked into the tempo. The addition is compensated, and the test suite checks that ten thousand beats stay evenly spaced to within a nanosecond, and that the spacing holds at every tempo the tool plays.
- How does tap tempo work?
- Tap the button, or press T, at least twice in time with the music. The gaps between your taps are averaged, up to the last eight of them, and the result is shown to one decimal place beside the whole number it rounds to. A pause longer than two seconds is treated as the end of one attempt rather than a very slow beat, so the taps before it are dropped instead of dragging the average down. One consequence of that rule: tapping cannot ask for anything slower than 30 beats per minute. Type a slower tempo into the box instead.
- What do the subdivision settings do?
- They put extra clicks between the beats without changing the tempo. Quarter is one click per beat, eighth is two, triplet is three, sixteenth is four. The extra clicks keep the beat's pitch but are played quieter, so the beat still reads as the beat and the subdivisions sit under it. Changing the subdivision or the number of beats per bar starts a fresh bar on the next click, so the accent stays on beat one rather than landing in the middle.
- What do Largo, Andante and Allegro actually mean?
- They are the Italian words printed on a mechanical metronome's face, and they are a naming convention rather than a measurement. Composers used them for two centuries before anyone attached numbers, and different editions place the boundaries a few beats apart. The table on this page gives the usual ranges: Largo 40 to 59, Larghetto 60 to 65, Adagio 66 to 75, Andante 76 to 107, Moderato 108 to 119, Allegro 120 to 167, Vivace 168 to 175, Presto 176 to 199, Prestissimo 200 and up. Where two ranges meet, the faster name wins, so 120 is Allegro. Below 40 the conventional table simply stops, and this tool shows the time signature alone rather than inventing a name.
- Does it keep playing with the screen off or in another tab?
- On a phone, no. The browser suspends audio when you leave the tab or lock the screen, and the click stops, then picks up where it left off when you come back. On a desktop browser a tab that is making sound is usually left running in the background, but that is the browser's decision, not something a web page can hold it to. If the page is ever starved for longer than the look-ahead window, the beats that were lost are counted and the number is shown, rather than being fired late all at once. For practice away from the screen, a hardware metronome or an app that can hold an audio session is the right tool.
- How do I set it to exactly 60 or 120 beats per minute?
- Type the number into the tempo box, or use the minus and plus buttons for one beat at a time. On the keyboard, the up and down arrows move by one, the left and right arrows by five, the space bar starts and stops, and T taps. Anything from 20 to 300 is playable, and a number outside that range is refused with a message saying so rather than quietly changed. Your tempo, meter, sound and volume are remembered in this browser for next time.
- Is anything uploaded?
- No. The clicks are generated in your browser with Web Audio, there is no recording and no account, and the only thing stored is your own settings, in this browser, so the tool opens where you left it.
Beats are scheduled on the audio hardware clock a tenth of a second ahead, the method used by browser sequencers, so the pulse does not drift when the page is busy. Tap tempo averages your last eight taps.