Fancy Audio Visualizations in HTML5 and the Web Audio API
JavaScript CSS HTML
Switch branches/tags
Nothing to show
Clone or download
Latest commit 9f8db66 Aug 22, 2017
Failed to load latest commit information.
LICENSE Updated, added LICENSE Jun 15, 2015 Update Aug 22, 2017
index.html Fixed typo Jun 16, 2015
loader.css Loader Jun 15, 2015
screenshot.png Added Jun 15, 2015
script.js Loader Jun 15, 2015
style.css Fixed typo, design fix Jun 16, 2015

HTML5 Web Audio API Showcase

Screenshot of the Project

Demo of the showcase

... can be found at

How to use

  1. Select an audio file
  2. Press "Play song"
  3. Modify the volume by scrolling on the circle canvas
  4. Enjoy!


  • no external libraries, pure Javascript
  • audio visualization with the spectrum of the played sound
  • volume by scrolling on the circle
  • elapsed and remaining time of the playback
  • filename displayed at the top of the circle (animates if it is too long)
  • build with Material Design (not for the circle because shadows are too resource-intense)



lastest GPL-license (see LICENSE-file)

Copyright (C) 2015 NIPE-SYSTEMS,