A curated collection of inspirational AI-powered JavaScript apps


Built by Elle, Asim, Osama - hosted on Azure

Melody Mixer

Using TensorFlow.js to Mix Melodies in the Browser


  • TensorFlow.js
  • MusicVAE.js
  • P5.js
  • Tone.js


This experiment came from a simple idea: what would it sound like to blend two different musical melodies together?

Melody Mixer uses MusicVAE.js, a web framework released by the Magenta research team at Google. You can combine and transform two different melodies by blending them at given percentages.

MusicVAE.js handles the blending by running a deep neural network locally in your browser, using TensorFlow.js.

Try the demo. First, listen to the two separate melodies, then click and drag the melodies apart, and listen to what you get. The computer has morphed one melody into the other.

The model was trained with 28 million different melodies —  Read more about this here