Drum Kit Web App

A simple interactive drum kit built using HTML, CSS, and JavaScript. Users can play different drum sounds by clicking on-screen buttons or pressing specific keys on the keyboard.

Live Demo

View Live

Features

• Clickable buttons for each drum sound
• Keyboard support (A, S, D, F, G, H, J keys)
• Smooth button animation when triggered
• Responsive layout
• No external libraries used

Technologies Used

• HTML
• CSS
• JavaScript

Installation

1. Clone the repository

git clone https://github.com/05-Jagritii/drum-kit.git
cd drum-kit

2. Open index.html in your browser

start index.html

Alternatively, use a Live Server extension in your code editor for live preview.

Project Structure

\drum-kit/
├── index.html
├── style.css
├── script.js
└── sounds/
    ├── crash.mp3
    ├── kick-bass.mp3
    ├── snare.mp3
    ├── tom-1.mp3
    ├── tom-2.mp3
    ├── tom-3.mp3
    └── tom-4.mp3

Author

Jagriti Kanwar
Mail : kanwarjagriti21@gmail.com
LinkedIn : Jagriti Kanwar