🎧 Spotify Homepage Clone

A professional Spotify Web Player UI Clone built using HTML and CSS. This project replicates the visual design of Spotify’s homepage, emphasizing layout accuracy, design consistency, and clean styling. No JavaScript or APIs are used — the focus is purely on the frontend interface and hover-based interactivity.

🖼️ Project Overview

This static web project recreates the Spotify homepage layout featuring navigation, playlists, trending sections, and a functional-looking media control bar. The design aims to demonstrate frontend development skills and attention to UI detail using only HTML and CSS.

📸 Screenshots

🧩 Tech Stack

HTML5 – Semantic structure and layout CSS3 – Styling, layout control, and hover effects Font Awesome / Spotify Icons – For player controls and navigation (if applicable)

✨ Key Features

🎨 Spotify-inspired dark UI theme 🧭 Sidebar navigation and library section 🖱️ Smooth hover transitions and interactive elements 💿 Static media player with playback controls (UI only) 🪄 Clean, maintainable CSS codebase

📂 Folder Structure Spotify-Clone/ │ ├── index.html ├── style.css ├── /assets │ ├── images/ │ └── icons/ └── README.md

🚀 How to Run Locally

Clone the repository: git clone https://github.com/your-username/spotify-homepage-clone.git

📈 Future Enhancements

Add JavaScript functionality for audio playback and controls Make the design fully responsive for mobile and tablet screens Integrate Spotify API for live playlists and recommendations

🧠 Learning Outcomes

Through this project, I enhanced my understanding of: Structuring modern web layouts using HTML and CSS Creating visually consistent UI components Building pixel-perfect designs inspired by real-world web apps