KeyWave Piano is a modern, interactive browser-based piano built using HTML, CSS, and JavaScript. It allows users to play music using their keyboard or mouse, while also offering guided learning, quizzes, and multiple sound controls.

• Play notes using keyboard keys or mouse clicks
• Smooth and responsive sound playback
• Visual key animations for better feedback

Interactive learning system with 3 modes:

• Learn popular songs like:

  • Twinkle Twinkle ⭐
  • Happy Birthday 🎂
  • Ode to Joy 🎼

• Step-by-step note guidance

• Auto-play option for demonstration

• Progress tracking system

• Displays:

  • Note name
  • Keyboard key
  • Finger hint
  • Frequency (Hz)

• Quick reference chart for octave mapping

• Test your musical skills

• Score + streak tracking 🔥

• Difficulty levels:

  • Easy
  • Medium
  • Hard

• Replay note option

• Octave Control → Change pitch range

• Volume Control → Adjust sound level

• Waveform Selection:

  • Sine
  • Triangle
  • Square
  • Sawtooth

• Sustain Control → Adjust note duration

• Clean modern interface
• Animated glowing effects
• Responsive design
• Real-time visual feedback

Black Keys:

KeyWave-Piano/
│
├── index.html
├── style.css
├── script.js

• HTML5
• CSS3 (Animations + Layout)
• JavaScript (DOM + Audio Logic)

1. Download or clone the repository
2. Open index.html in your browser
3. Start playing 🎹

• Recording & playback system
• Custom sound packs (piano, drums, synth)
• Mobile gesture optimization
• Save user progress

Built by Anoop A

This project is designed to combine music, interaction, and learning into one smooth experience. If you like it, consider improving it further or adding new features 🚀