Discover the best music-and-sound websites created by professional designers. Get inspired and start planning your perfect music-and-sound web design today!

Uplift Web Design

A powerful audio player plugin for displaying and streaming your audio files. Our audio player supports all the features you'll need to create a robust music powered website. Design your audio player to look how you want and use our attributes to add the functionality.

True Audio Player

Webflow Audio Player

Howler.js Audio

Jesus Jam

JesusJam

I have seen many projects lately which add sound effects to buttons so I wanted to share how to do it.

Each of the sounds needs their own code. You can find the code in each embed.

To add them to your project:

1. Add a class to the div where you want the sound to play when clicked.
2. Add an embed and paste the code in your project.
3. Change the code to match your class name and the mp3 address where you hosted your audio file.

****Important****

- Do not link to the audio files on the clonable. Make sure to host the audio file in your server. These files will be removed and they won’t work in the near future.
- You need to publish the project to hear the sounds

Sounds by:

soundbible.com
Mixit.co

Sign up for the lesson: www.webflowtips.com/b/how-to-add-audio-sounds-to-buttons

If you have any questions feel free to comment.

P.S Like or follow if this was useful for you 🙂 🙌

Buttons with sound

Buttons with Sounds / Audio

Created this landing page for SOUNDHUT with the idea of creating a dark themed, black & yellow template for you to clone and use for your music themed sites.

This landing page includes:

- A cool minimal preloader
- Navigation bar with glass effect
- A hero section with a video background
- Slick and minimal animations on scrolling to view
- Optimized for mobile

Feel free to let us know what you think and clone away!

Pages built: Home

__


You can thank me by:
• Hiring us to help you rebrand in 1 month 👉 oracleadvertising.com

• Following us on Behance 👉 https://www.behance.net/oracleadvertising
• Following us on Instagram 👉 https://www.instagram.com/oracleadvertising/

SOUND HUT

Sound Hut Landing Page

Hi Everyone, 

Back again with another project this time it is a sound player that uses some Jquery and HTML embed to work together. Feel free to clone and use as you wish.

Sleepy Baby

Native Audio Player in Webflow

kingseo.

Welcome to Ducks&Boombs V1. A game made in webflow where your goal is to score all ducks without taking the bad bombs.

- Maximum score: 9 points. 
- Difficulty: Very hard.

***** TEAM NOTE FOR WEBFLOW DEVS AND DESIGNERS ****

We wanted to have some fun and push webflow animations to explore it capacities and performance. So we did a simple game using almost 100% Webflow animations. 

JavaScript is only used for music and sounds.
Building time spent: ~15hours.

We hope you like it, and PLEASE leave feedback! there might be an ambitious V2 x)

Happy Duckin'

- kingseo team.

#game #gaming #videogame #interactions #interactive #ux/ui #gamedesign #music&sound

Ducks&Booms

Ducks&Boombs! Webflow game

Redesign of Exzellenz Music website. A weekly podcast for Electronic Music from artists all over the world

exzellenzmusic

Exzellenz Music Podcast

Find, share and submit your favourite platforms from Soundcloud, Spotify or Apple Music! Get involved by submitting your favourite playlist.

Selected

Selected Sounds

A Redesign for an Talent and Events Agency based in Curitiba, Brazil

Grow Music and Artists

Grow Music and Artists Dj Agency

I decided to remake one of my favorite website in webflow. It ended up looking great! 
There are a few things I learned;
1. Use columns instead of flexbox when possible because flexbox is more process intensive
2. Use relative position to create hover elements if it is not in the direct parent element (look at "follow the project" section to see further)

I also have two questions;
1. How do you center the video background relative to the screen width?
2. How do you create an element that continually rotates?

Day of the Dead

Day of the Dead Remake in Webflow

One of our latest projects in collaboration with @studiosentempo.
Master essential music production skills via interactive learning. Learn to create, record and mix at music industry standard with Lim London.
production url: https://www.limlondon.com/
Awwwards Site of the Day - May 10, 2023

LimLondon

Web Design for Atlanta Producers Nard & B

trenchwerk

Nard & B Trench Werk

Mixed By Toast - Online Audio Mixing website. Our first go at using web flow offering a Pay As What You Want Service.

Mixed by toast

Mixed By Toast - Online Mixing

Band website for Capital Party function band 🤘

Full design and development with at least 90% Finsweet Client First styles, plus a little improv.

Capital Party

Soul Atomic

This is my own website designed to showcase my work and services. The design is simple, concise and functional.

Marialicia Leon

Pinecone Agency

This is a music agency website we designed and developed for Raida Artists. The real website is hosted on the client's own Webflow Account and can be seen here: www.raidaartists.com.au

This is a duplicate of the website we designed for our client.

If you would like a website designed and developed, please feel free to reach out to us at Pinecone.Agency

Discover music and sound websites built by the Webflow community

Discover music and sound websites built by the Webflow community