Skip to content

tech-garv/Drum-Kit

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

4 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

πŸ₯ Drum Kit

Welcome to the Drum Kit project – a fun and interactive musical web app built with HTML, CSS, and JavaScript. Play awesome drum sounds by clicking on the buttons or pressing the keys W, A, S, D, J, K, L on your keyboard!


πŸ”— Live Demo

Click here to try the Drum Kit live


πŸš€ Features

  • 🎹 Press keyboard keys to trigger drum sounds
  • πŸ–±οΈ Click on buttons to play corresponding sounds
  • 🎨 Clean and minimal design with animations
  • πŸ’‘ Beginner-friendly code structure
  • ❀️ Made with love by Garv

πŸ’‘ How It Works

Each key (w, a, s, d, j, k, l) is mapped to a unique drum sound. When a key is pressed or a button is clicked:

  • The sound is played using JavaScript's Audio object
  • A visual animation is triggered on the button to show feedback

πŸ› οΈ Tech Stack

  • HTML5 – Structure of the web page
  • CSS3 – Styling and basic layout
  • JavaScript – Event handling and sound control

About

: 🎡 An interactive Drum Kit web app built with HTML, CSS, and JavaScript. Press keys or click buttons to play drum sounds!

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors