css Audio - Active file-generic CSS - Active Generic - Active HTML - Active JS - Active SVG - Active Text - Active file-generic Video - Active header Love html icon-new-collection icon-person icon-team numbered-list123 pop-out spinner split-screen star tv
CodePen probably won't work great in this browser. We generally only support the major desktop browsers like Chrome, Firefox, Safari, and Edge. Use this one at your own risk! If you're looking to test things, try looking at Pens/Projects in Debug View.
user profile image

Legendary 8-bit games music recreated using the Web Audio API


  1. Very cool stuff ! I am curious: how much time did you put into this whole thing?

  2. @oemueller took about a month, since I was writing an article about this thing. It has been custom designed, music has been converted to js, games playback videos have been recorded/cut etc. I didn't dedicate all of my time to this project and looking back it seems that it's possible to do it much faster, however creating it from rough idea in mind requires a lot of research, thinking and throwing away some work sometimes :)

  3. Pretty awesome. Seeing this and listening to the midi brings back some very good memories of my childhood.

  4. @achum86 thanks Alec, this is not midi actually, those note are produced using code

  5. I was literally looking at this pen yesterday because I am trying to teach myself audio API, and today it is a Picked Pen. Congrats, and phenomenal work!

  6. @PrestonHaworth thanks a lot Preston and let me know if I can help exploring Web Audio API :)

  7. I would love help, but I am still just scratching the surface. You can go check out the Pen I am working on now. Maybe you will know what direction I need to go next, or have some tutorials in mind.


    As for now, I have so many questions I might as well have no questions because I feel like after every time I write a line of code, I get a headache! But things are starting to click. I actually have a song now, so that's something.


  9. Great stuff! I'm guessing the NES had four channels for music? How did it handle sound effects like picking up coins and squashing enemies, do you know?

  10. Awesome stuff! Unfortutunately due to the new autoplay policy in Chrome, this does no longer work since December 2018. Could you add resuming of the AudioContext on Start button press to fix it?

Leave a Comment Markdown supported. Click @usernames to add to comment.

You must be logged in to comment.