About the Project
The SoundFont Web Player project delivers a versatile solution for SoundFont (SF2) files, featuring an extensive library, an intuitive web player, and a powerful JavaScript API. It's designed for musicians, developers, and anyone passionate about high-quality sounds in the browser.
Key Features
Intuitive Web Player
Enjoy a user-friendly web interface for playing SoundFonts, complete with instrument browsing, playback controls, and optional visual feedback.
Core Playback & Navigation
- Intuitive User Interface
- Instrument Library Browser
- Playback Controls (Play, Pause, Stop, Volume)
- Visual Feedback (Output Meter)
Advanced User Features
- Responsive Design
- Drag and Drop Support
- Keyboard Input (Virtual & MIDI)
- Instrument Search & Filtering
- Preset Management
- MIDI File Playback (Coming Soon)
- Instrument Preview
Robust JavaScript API
Leverage a well-documented JavaScript API to programmatically interact with SoundFonts in web applications, enabling rich audio experiences.
SoundFont Management & Loading
- SoundFont Loader Module
- Asynchronous Loading with Progress Events
- Caching Mechanisms
Instrument & Synthesizer Control
- Instrument Access and Selection
- Note Playback API
- Synthesizer Parameter Control
- Web Audio API Integration
Advanced API Features & Architecture
- Event-Driven Architecture
- Modular Design
- Comprehensive Documentation
- MIDI Input Handling API
- Instrument Metadata API
Curated SoundFont Library
Access a growing library of SoundFont files, carefully organized by genre and instrument type for easy discovery and use.
- Categorized by Genre, Instrument Type, and Mood
- Intuitive Browsing and Discovery
- Growing Collection of High-Quality SoundFonts
Web Player Demo
Experiment with the SoundFont player directly in your browser. Load SoundFonts, select instruments, and start creating music!
Interactive Keyboard
Instrument Categories
JavaScript API
Integrate the SoundFont engine into your web projects with our comprehensive JavaScript API. Control SoundFont loading, instrument selection, playback, effects, and more.
API Highlights
- SoundFont Management: Load and unload SoundFonts dynamically from various sources.
- Instrument Control: Programmatically select and switch instruments within loaded SoundFonts.
- Note Playback: Trigger and stop notes with precise control over parameters like velocity and duration.
- Audio Effects: Adjust volume, pan, reverb, and chorus settings via the API.
- Preset Handling: Load and apply saved presets to quickly configure instruments and effects.
- MIDI Input: Handle MIDI input events for interactive musical applications.
API Methods
SoundFontWebPlayer.loadSoundFont(base64Data, filename, soundfontId): Loads a SoundFont from base64 encoded data.SoundFontWebPlayer.unloadSoundFont(soundfontId): Unloads a SoundFont by its ID.SoundFontWebPlayer.changeSoundFont(soundfontId): Changes the active SoundFont.SoundFontWebPlayer.getSoundFontList(): Returns a list of loaded SoundFonts.SoundFontWebPlayer.getInstrumentList(soundfontId): Returns a list of instruments in a SoundFont.SoundFontWebPlayer.changeInstrument(instrumentId): Changes the current instrument.SoundFontWebPlayer.playNote(note, instrumentId, duration, velocity, soundfontId): Plays a MIDI note.SoundFontWebPlayer.stopNote(note, instrumentId, soundfontId): Stops a MIDI note.SoundFontWebPlayer.setVolume(volume): Sets the master volume (0 to 1).SoundFontWebPlayer.setPan(pan): Sets the stereo pan (-1 to 1).SoundFontWebPlayer.setReverb(reverb): Sets the reverb amount (0 to 1).SoundFontWebPlayer.setChorus(chorus): Sets the chorus amount (0 to 1).SoundFontWebPlayer.mute(): Mutes the audio output.SoundFontWebPlayer.unmute(): Unmutes the audio output.SoundFontWebPlayer.isMuted(): Returns boolean indicating mute state.SoundFontWebPlayer.getCurrentSoundFontId(): Returns the ID of the current SoundFont.SoundFontWebPlayer.getCurrentInstrumentId(): Returns the ID of the current instrument.SoundFontWebPlayer.applyPreset(preset): Applies a preset object.SoundFontWebPlayer.getCurrentPreset(): Returns the current preset object.SoundFontWebPlayer.loadPresetList(): Loads and displays the preset list.SoundFontWebPlayer.saveCurrentPreset(): Saves the current settings as a preset.
For detailed documentation and examples, please visit our API Documentation section (coming soon).
Join the Community
Become a part of the SoundFont Web Player Project! Contribute, share your feedback, and help us improve and expand the project.
Get Involved
- Contribute SoundFonts: Expand our library by contributing high-quality SoundFont files.
- Create Instrument Presets: Design and share unique presets for various genres and instruments.
- Develop New Features: Help enhance the web player and JavaScript API by contributing code.
- Provide Feedback & Suggestions: Share your ideas and report issues to help us improve the project for everyone.
Learn more about contributing on our Contribution Guidelines page (coming soon).
Community Showcase
Explore and listen to musical creations from our community members (coming soon).
Project Roadmap
Stay informed about the project's development with our public roadmap. See planned features, upcoming milestones, and progress updates on our Roadmap page (coming soon).
Technology Stack
The SoundFont Web Player Project is built using the following technologies:
- SoundFont Format: SF2 and SF3 (SoundFont 2.01) for high-fidelity instrument samples.
- Web Audio API: For advanced and efficient audio processing and playback in the browser.
- Web MIDI API: Enabling seamless MIDI input from external MIDI devices.
- JavaScript (ES Modules): For core logic, API, and web player functionality, organized in modules.
- HTML5 & CSS3: For structuring and styling the user interface, ensuring responsiveness and accessibility.
- Git & GitHub: For version control, collaborative development, and open-source project management.