# CSS Music Player


 

When I’ve done a lot of hard work during my dev-job, I love to get back to my comfort zone.

I do this by building simple designs for relaxation. For some, this will be a challenge, but if you have built thousands of designs from Photoshop to HTML and CSS, this can be really relaxing.

I got the design from [Rovane Durso](https://dribbble.com/shots/998479-Music) on Dribbble.

If you would like to see a tutorial where I build this step by step, please let me know in the comments 👍.

> I’m currently working on a series about building a Serverless Webshop with Angular, Serverless functions, and [FaunaDB](https://dashboard.fauna.com/accounts/register?utm_source=DevTo&utm_medium=referral&utm_campaign=WritewithFauna_BuildServerlessWorkshop_Raymon_recommendation) which I highly recommend checking out.

[**How To Build A Serverless Webshop**  
_With FaunaDB, Netlify Serverless Functions and Angular_medium.com](https://medium.com/@devbyrayray/how-to-build-a-serverless-webshop-3dabd13b0ac7 "https://medium.com/@devbyrayray/how-to-build-a-serverless-webshop-3dabd13b0ac7")[](https://medium.com/@devbyrayray/how-to-build-a-serverless-webshop-3dabd13b0ac7)

[**Webshop Product List and Detail view with Angular**  
_How to get product data from the FaunaDB database serverless functions in Netlify_medium.com](https://medium.com/@devbyrayray/how-to-build-a-serverless-webshop-part-2-733925518e80 "https://medium.com/@devbyrayray/how-to-build-a-serverless-webshop-part-2-733925518e80")[](https://medium.com/@devbyrayray/how-to-build-a-serverless-webshop-part-2-733925518e80)

### Read more from me

[**TypeScript’s New Top-Level Await**  
_We don’t need an async function wrapper anymore_medium.com](https://medium.com/better-programming/typescripts-new-top-level-await-cc6beadbde8 "https://medium.com/better-programming/typescripts-new-top-level-await-cc6beadbde8")[](https://medium.com/better-programming/typescripts-new-top-level-await-cc6beadbde8)

[**Native Lazy Loading in the Browser**  
_How we do it now and how we did it in the early days_medium.com](https://medium.com/better-programming/native-lazy-loading-in-the-browser-85dabe6653ed "https://medium.com/better-programming/native-lazy-loading-in-the-browser-85dabe6653ed")[](https://medium.com/better-programming/native-lazy-loading-in-the-browser-85dabe6653ed)

[**How To Build A Dark Mode Switcher with CSS Variables**  
_Build a Dark Mode Switcher with CSS Variable, JavaScript and TypeScript_levelup.gitconnected.com](https://levelup.gitconnected.com/how-to-build-a-dark-mode-switcher-with-css-variables-ccb13f7441a0 "https://levelup.gitconnected.com/how-to-build-a-dark-mode-switcher-with-css-variables-ccb13f7441a0")[](https://levelup.gitconnected.com/how-to-build-a-dark-mode-switcher-with-css-variables-ccb13f7441a0)

[**How to Create Gradient Titles Like Apple’s iPad Pro Page**  
_Use CSS to build them yourself_medium.com](https://medium.com/better-programming/how-to-create-gradient-titles-like-apples-ipad-pro-page-a0647ec83e51 "https://medium.com/better-programming/how-to-create-gradient-titles-like-apples-ipad-pro-page-a0647ec83e51")[](https://medium.com/better-programming/how-to-create-gradient-titles-like-apples-ipad-pro-page-a0647ec83e51)