Float:ImgPlay
A library that converts images into sound
A JavaScript library that analyzes pixel data from images to generate rule-based music. Works directly in the browser using Web Audio API, running entirely client-side without any server.
JavaScript
Web Audio API
Image → Sound
npm
MIT (commercial use allowed)
Installation
$
npm install float-imgplay
Key Features
- Image → Sound conversion — Maps pixel color, brightness, and saturation to pitch, rhythm, and harmony
- 5 sound algorithms — RGBA Digit, Brightness, Color Harmony, Spectral, Contour
- 20 instrument presets — Piano, Strings, Bass, Synth Lead, Brass, Flute, and more
- 10 ensemble presets — Orchestra, Rock Band, Jazz Trio, Electronic, Cinematic, and more
- Custom algorithm plugins — Register your own sound conversion logic
- MIDI export — Download generated music as Standard MIDI File
- PNG metadata embedding — Embed MIDI data inside image files
- JSON preset sharing — Export/import settings as JSON
- UI controls — Play, volume, speed, and settings popup overlaid on images
- Multi-image playback — Play multiple images simultaneously like an orchestra with playAll()
Quick Start
HTML
<div class="float-imgplay"> <img src="photo.jpg" width="320" height="320"> </div> <script src="https://unpkg.com/float-imgplay"></script> <script> new FloatImgPlay({ selector: '.float-imgplay', ensemble: 'orchestra', audio: { algorithm: 'color-harmony' } }).init(); </script>
API Highlights
JavaScript
// 앙상블로 재생 new FloatImgPlay({ ensemble: 'cinematic' }).init(); // 커스텀 악기 조합 new FloatImgPlay({ instruments: [ { preset: 'piano', volume: 0.25 }, { preset: 'strings', volume: 0.18 }, { preset: 'bass', volume: 0.2 } ], audio: { algorithm: 'spectral', tempo: 90 } }).init(); // 설정을 JSON으로 내보내기/가져오기 const config = player.exportConfig(); player.importConfig(config); // 모든 이미지 동시 재생 player.playAll();
Links
MIT (commercial use allowed)