https://github.com/mohammadsameer01/spotify

A sleek, modern Spotify Clone for seamless music streaming with PWA support, dynamic UI, and lyrics fetching.
https://github.com/mohammadsameer01/spotify

html5 javascipt javascript-project spotify spotify-clone spotify-clone-app

Last synced: 11 months ago
JSON representation

A sleek, modern Spotify Clone for seamless music streaming with PWA support, dynamic UI, and lyrics fetching.

• Host: GitHub
• URL: https://github.com/mohammadsameer01/spotify
• Owner: MohammadSameer01
• Created: 2025-02-24T14:01:10.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2025-03-15T09:41:12.000Z (over 1 year ago)
• Last Synced: 2025-05-17T15:13:56.731Z (about 1 year ago)
• Topics: html5, javascipt, javascript-project, spotify, spotify-clone, spotify-clone-app
• Language: JavaScript
• Homepage: https://mohammadsameer01.github.io/spotify/
• Size: 51.4 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# Spotify Clone - Web Music Player 🎵

![Spotify Clone Banner](assets/img/mainLogo.png)

## 🚀 Overview

Welcome to the **Spotify Clone**, a modern and responsive web music player that allows users to stream their favorite songs seamlessly. Built with **HTML, CSS, and JavaScript**, this project is designed to provide a sleek and intuitive music streaming experience.

## 🌟 Features

- 🎧 **Music Streaming** - Play songs with smooth audio playback.

- 📂 **Preloaded Songs** - Enjoy a collection of popular tracks.

- 📱 **PWA Support** - Installable as a Progressive Web App.

- 🎨 **Dynamic UI** - Auto-adjusts theme color based on the song.

- 🎵 **Lyrics Fetching** - Displays song lyrics using Genius API.

- 🔄 **Swipe Gestures** - Touch-friendly navigation for mobile users.

- 📑 **Playlist Management** - Categorized song lists like 'Liked Songs' and 'Trending'.

## 🖥️ Live Demo

🔗 [Try the Spotify Clone](https://mohammadsameer01.github.io/spotify/)

## 📸 Screenshots

![Music Player UI](assets/img/demoPhotos/photo1.png)

![Now Playing Bar](assets/img/demoPhotos/photo2.png)

![Now Playing Panel](assets/img/demoPhotos/photo3.png)

![About the Artist Panel](assets/img/demoPhotos/photo4.png)

![Lyrics Panel](assets/img/demoPhotos/photo5.png)

![Now Playing Panel for GOAT](assets/img/demoPhotos/photo6.png)

## 🛠️ Technologies Used

- **HTML** - Structure and content

- **CSS (Flexbox & Grid)** - Responsive and modern UI

- **JavaScript (ES6+)** - Dynamic interactions

- **Manifest.json** - PWA support

- **Genius API** - Lyrics fetching

## 📥 Installation

1. Clone the repository:

   ```bash

   git clone https://github.com/mohammadsameer01/spotify.git

   ```