HTML5 Bytebeat
A browser playground where tiny JavaScript formulas become music, noise and visual chaos. Change one number, discover a groove by accident and spend the next hour afraid to touch it.
Programming - Live Code
Product information
Overview
HTML5 ByteBeat is what happens when a JavaScript expression is given a speaker and absolutely no adult supervision. Feed it a formula based on time and the browser evaluates it continuously, turning arithmetic, bit shifts and other tiny pieces of code directly into sound. The results range from primitive buzzing to rhythms, melodies and surprisingly elaborate little compositions. There is no piano roll hiding underneath. Sometimes the entire musical idea really is just one gloriously cursed line of maths.
One Variable, Ridiculous Consequences
Traditional bytebeat starts with an almost absurd limitation. Your expression receives a time counter called t and produces values between 0 and 255, usually at a low sample rate such as 8000 Hz. That tiny playground is somehow enough to generate drums, basslines, melodies and textures from bitwise arithmetic alone. HTML5 ByteBeat also supports floatbeat for smoother floating-point output, along with several expression styles. Start with something simple, change one operator and suddenly the calculator has formed a band.
Discover First, Understand Later
Bytebeat has a long tradition of happy accidents. Early researchers found that surprisingly musical structures could emerge from formulas discovered through experimentation, and some contributors openly admitted they did not entirely understand why their creations worked. That spirit fits HTML5 ByteBeat perfectly. Change a number, move a shift, add an operator and listen. Sometimes you get silence. Sometimes digital violence. Sometimes you accidentally discover a groove and spend the next hour being afraid to touch the formula.
It Also Draws Pretty Things
The same streams of numbers producing the audio can also become visual material, and HTML5 ByteBeat includes waveform, canvas and WebGL visualization tools for exploring that side of the chaos. That makes the experience oddly hypnotic. You are not only hearing the structure hidden inside an expression, you can watch it unfold into lines, patterns and shapes at the same time. Write questionable JavaScript, receive audiovisual art. Computer science departments should advertise this more often.
The Browser Is the Synth
Gregg Tavares built HTML5 ByteBeat around ordinary JavaScript and browser audio technology, which means exploring bytebeat requires almost nothing beyond opening the page. No compiler, no DAW, no plugin scan and no twenty-minute setup ritual before the first noise. That immediacy is a huge part of its charm. Paste an old formula, mutate it beyond recognition, invent your own or simply poke numbers until something interesting happens. The barrier between curiosity and sound is basically the Enter key.