Skip to content

adaptBit/AudioVisualizer

Repository files navigation

Audio Visualizer

This is a simple Next.js audio visualizer that allows users to input music from their PC and change the background image. It also includes a music controller to manage the audio.
This project is not yet optimized for mobile devices.

Live demo

https://adaptbit-audio.netlify.app/

Features:

  • Input music from PC
  • Change background image
  • Music controller

Installation:

Clone the repository. Install the dependencies:

npm install

Usage:

Start the development server:

npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev

Open the application in a web browser:

http://localhost:3000

Click the "Browse File" to input music/drop it from your PC.
You can drop image to all area beside music drop zone on the left to change the background image.
Use the music controller to play, pause, stop, skip, shuffle and rewind the audio.

Contributing:

If you want to contribute to this project, please read the contributing guidelines.

License:

This project is licensed under the MIT license.

Additional notes:

The audio visualizer is built with Web Audio API.
The default background image is defaultBackground.jpg, which is located in the /public directory.

Troubleshooting:

If the audio visualization is not working, make sure that the music file is in a supported format (MP3, WAV, FLAC, AAC, OGG).
If the background image is not showing up, make sure that the image file is in a valid format (PNG, JPG, JPEG).
I hope this README.md file is helpful. Please let me know if you have any questions or feedback.

About

No description, website, or topics provided.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors