BLOOB

Using a MIDI Keyboard in the Browser: What Web MIDI Can and Cannot Do

A browser tab can read your MIDI keyboard. It cannot read your mind, your DAW, or a device another program has already claimed — here is the actual boundary.

Published 2026-09-10 · Web MIDI · Controllers · Browsers

Web MIDI is a small, old-fashioned API: the browser hands a page raw MIDI messages and gets out of the way. That is enough to play an instrument in a tab, and it is nothing like enough to replace a DAW. Knowing which side of that line a feature falls on saves a lot of troubleshooting.

What actually reaches the page

Everything your controller sends on its ports arrives as three bytes at a time, and BLOOB acts on the ones a player expects:

What Web MIDI cannot do, in any browser

MIDI is control data, not audio. The web page has to make the sound itself — so the thing you hear is BLOOB's own synth (Keys, Pluck, Bass, Pad or Bell), never the sound engine inside your keyboard. If you want the sound of your hardware, take its audio output into an interface and use the microphone/instrument input instead; the visuals then read the real thing.

A few more honest limits. The browser does not follow MIDI clock or timecode here — tempo is detected from the audio, which is what makes the visuals work with a microphone or a shared tab as well. There is no MPE, so per-note bend collapses into the global bend. There is no SysEx unless a page asks for it explicitly, and BLOOB does not. And the page cannot send anything back to light up the pads on your controller.

Browser support, and why

Chrome, Edge and other Chromium browsers implement Web MIDI on Mac, Windows, Linux and ChromeOS. Firefox and Safari do not expose it. That is a deliberate privacy position rather than an oversight: the list of MIDI devices attached to a machine is a fingerprinting surface, and SysEx access can reflash firmware on some hardware. It is a defensible call, and it means a MIDI page has to degrade gracefully. In BLOOB the same instrument is playable from the computer keyboard everywhere, so on Safari you lose velocity and the pedal, not the feature.

Getting a stubborn controller to appear

  1. Open the page in Chrome or Edge over HTTPS. Web MIDI is a secure-context API; a page served over plain HTTP will not get access.
  2. Plug the keyboard in before you click, then click MIDI keyboard and accept the permission prompt. Denying it once is sticky — clear it in the padlock menu of the address bar.
  3. Close anything that already owns the port. On Windows a class-compliant MIDI port is commonly exclusive: if your DAW has the keyboard open, the browser will not see it. Quit the DAW, or use a second port or a virtual MIDI cable.
  4. Prefer a direct USB connection while testing. Unpowered hubs and long cables cause dropped messages that look exactly like a broken device.
  5. Bluetooth MIDI works when the operating system has already paired the device and presents it as a normal MIDI port — pair it in the system settings first, not in the browser.
  6. Still nothing? Play a note and watch the free-play status line; if a note sounds but nothing draws, the problem is audio output, not MIDI.

Latency, and what to do about it

The path is short — message in, Web Audio voice out — and on a normal machine the delay between pressing a key and hearing it is small enough to play through. Bluetooth headphones are the usual culprit when it is not: they add real output latency, which you can hear. BLOOB measures the output latency the browser reports and shifts the beat prediction to compensate, so the visuals stay locked to what you hear even when the audio path is slow. That fixes the picture, not the feel of the keys; for playing, use wired output.

What it is good for

Practice with something to look at. Streaming a keyboard part where the overlay actually follows your dynamics. Teaching, because a controller with weighted keys makes the velocity point obvious in about four seconds. And playing over a loaded track, which is the thing people do not expect a browser tab to allow: load a song, press K, and the analyser hears you and the track together.

Open with MIDI MIDI visualizer page

Keep reading