//This ia a Spotify-Clone.
<link rel="icon" href="./Assets/logo.png">
<title>Spotify - Web Player: Music for everyone</title>
<link rel="stylesheet" href="Style.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
Create your first playlist
It's easy, we'll help you
Create playlistLet's find some podcasts to follow
We'll keep you updated on new episodes
Browse podcasts
Explore Premium
Install App
</div>
<h2>Recently Played </h2>
<div class="cards-container">
<div class="card">
<img src="Assets/card1img.jpeg" class="card-img">
<p class="card-title">Top 50-Global</p>
<p class="card-info">Your daily updates of the most played ... </p>
</div>
</div>
<h2>Trending now near you </h2>
<div class="cards-container">
<div class="card">
<img src="Assets/card2img.jpeg" class="card-img">
<p class="card-title">Top 50-Global</p>
<p class="card-info">Your daily updates of the most played ... </p>
</div>
<div class="card">
<img src="Assets/card3img.jpeg" class="card-img">
<p class="card-title">Top 50-Global</p>
<p class="card-info">Your daily updates of the most played ... </p>
</div>
<div class="card">
<img src="Assets/card4img.jpeg" class="card-img">
<p class="card-title">Top 50-Global</p>
<p class="card-info">Your daily updates of the most played ... </p>
</div>
<div class="card">
<img src="Assets/card2img.jpeg" class="card-img">
<p class="card-title">Top 50-Global</p>
<p class="card-info">Your daily updates of the most played ... </p>
</div>
<div class="card">
<img src="Assets/card3img.jpeg" class="card-img">
<p class="card-title">Top 50-Global</p>
<p class="card-info">Your daily updates of the most played ... </p>
</div>
</div>
<h2>Featured Charts </h2>
<div class="cards-container">
<div class="card">
<img src="Assets/card5img.jpeg" class="card-img">
<p class="card-title">Top 50-Global</p>
<p class="card-info">Your daily updates of the most played ... </p>
</div>
<div class="card">
<img src="Assets/card6img.jpeg" class="card-img">
<p class="card-title">Top Songs-India</p>
<p class="card-info">Your daily updates of the most played ... </p>
</div>
<div class="card">
<img src="Assets/card1img.jpeg" class="card-img">
<p class="card-title">Top 50-Global</p>
<p class="card-info">Your daily updates of the most played ... </p>
</div>
</div>
<div class="footer">
<div class="line">
</div>
</div>
</div>
<div class="music-player">
<div class="album"></div>
<div class="player">
<div class="player-controls">
<img src="./Assets/player_icon1.png" class="player-control-icon">
<img src="./Assets/player_icon2.png" class="player-control-icon">
<img src="./Assets/player_icon3.png" class="player-control-icon" style="opacity:1; height:2rem">
<img src="./Assets/player_icon4.png" class="player-control-icon">
<img src="./Assets/player_icon5.png" class="player-control-icon">
</div>
<div class="playback-bar">
<span class="curr-time">00:00</span>
<input type="range" min="0" max="100" class="progress-bar" step="1">
<span class="tot-time">3:33</span>
</div>
</div>
<div class="controls"></div>
</div>
</div>