TypeTone Piano Studio X

https://veduisback.github.io/piano_for_typists/
🎹 TypeTone Piano Studio X
A futuristic browser-based piano studio built using pure HTML, CSS, and JavaScript.

TypeTone transforms your keyboard into a playable multi-octave piano with real-time synthesized audio, chord support, recording, looping, custom sound engines, and an interactive piano UI.

✨ Features
🎹 Fully playable keyboard piano
🎵 3 octave key mapping
🎼 Chord system using _
🔊 10 synthesized sound engines
🌌 Dream pad synth
🔔 FM bell synthesis
🎛 Additive organ synthesis
🔥 Warm analog-style tone
🎸 Bass low-pass synth
⚡ Bright electric synth
⏺ Record & save melodies
🔁 Loop playback
🎚 Tempo / sustain / volume controls
🌗 Light & dark theme
📱 Mobile responsive UI
🎨 Modern futuristic interface
⌨ Key Mapping
Octave 1
Q W E R T Y U → C D E F G A B

1 2 3 4 5 → C# D# F# G# A#

Octave 2
Z X C V B N M → C D E F G A B

A S D F G → C# D# F# G# A#

Octave 3
I O P H J K L → C D E F G A B

6 7 8 9 0 → C# D# F# G# A#

🎼 Chord System
Use _ between keys to play chords.

Example:

q_e_t

Plays: C + E + G

Minor chord example:

q_3_t

Plays: C + Eb + G

📝 Song Format
Spaces = pause
_ = chord
/ = ultra-fast separator
New line = longer pause
Example melody:

3_5(3spaces)4(2spaces)2(4spaces)3(4spaces)3_5(3spaces)4(2spaces)2(4spaces)1

🎛 Sound Engines
Sound Description
Classic Pure sine piano
Soft Triangle wave
Retro Square wave
Electric Sawtooth synth
Warm Filtered analog tone
Dream Detuned ambient pad
Organ Additive harmonic organ
Bell FM metallic bell
Bass Deep filtered bass
Bright High-shelf electric tone
🚀 How To Run
Simply open the HTML file in any modern browser.

No installation required.

Works best in:

Google Chrome
Microsoft Edge
Firefox
⚠ Browser Audio Note
Some browsers block audio until user interaction.

Click anywhere on the page once before playing if audio does not start immediately.

🛠 Built With
HTML5
CSS3
Vanilla JavaScript
Web Audio API
🎹 Created By
TypeTone Piano Studio X Built for typists, musicians, and synth lovers.