Piano synth · kat-coder-pro-v2
Output generated Cost / run $0.0095 Runtime 68.8s
Prompt for this run
Using the pre-provided tone.min.js (global Tone), build a playable piano keyboard controlled by mouse and computer keys that synthesizes notes with an ADSR envelope and visual key feedback.
TAKE IT TO CODE
A single self-contained HTML file — copy it and open in any browser, or reuse the prompt with your own pi-agent run.
RUN
METRICS
Transcript · 4 messages
Using the pre-provided tone.min.js (global Tone), build a playable piano keyboard controlled by mouse and computer keys that synthesizes notes with an ADSR envelope and visual key feedback.
/workspace/index.html (14535 bytes)Successfully wrote 14535 bytes to /workspace/index.html
Done! I've created a fully functional piano synthesizer in `/workspace/index.html`. Here's what it includes: **Features:** - **Two-octave piano keyboard** with white and black keys - **Mouse interaction** - click, drag across keys, and release - **Keyboard mapping** - A S D F G H J K L ; for white keys, W E T Y U I O P for black keys - **ADSR envelope controls** - Attack, Decay, Sustain, Release sliders - **Waveform selection** - Triangle, Sine, Square, Sawtooth - **Volume control** - **Real-time waveform visualizer** showing the synthesized audio - **Visual feedback** - keys glow with gradient colors when pressed (blue→purple for white keys, purple→pink for black keys) - **Tone.js synthesis** using `Tone.Synth` with full ADSR envelope support **How to use:** 1. Open `index.html` in a browser 2. Click anywhere to initialize the audio context 3. Play with mouse or keyboard keys 4. Adjust ADSR sliders to shape the sound envelope 5. Change waveform for different timbres The app runs entirely client-side with no external dependencies beyond the pre-provided `tone.min.js`.