---
title: "BG Sound or Music — Free Framer component · Best of Framer"
description: "Free Framer component · by Aki · Players. Free Background Audio Control"
canonical: "https://framer.elliotli.dev/component/bg-sound-or-music"
---

[Home](/)/[Components](/components)/[Players](/components/category/players)/BG Sound or Music

# BG Sound or Music

Free Background Audio Control

[View on Framer](https://framer.com/marketplace/components/bg-sound-or-music/?via=elliot-li)

![BG Sound or Music preview image 1](https://framer.elliotli.dev/og/component/bg-sound-or-music/25a8db5f165ed61e/1600x900.jpg)

## Summary

Free Background Audio Control

## Description

**→** [Preview](https://backgroundsound.framer.website/)

**→** [Remix](https://framer.link/OpXuvHL)

Add background music or sound to your Framer site without dealing with custom audio setup.

**Background Music & Sound Control** gives you the audio functionality while letting you keep full control over the design. Use your own Framer component, variants, icons, animations, or button styles for the On and Off states.

Upload your audio file, adjust the volume, enable looping, and connect the toggle to your existing Framer interactions.

The component also remembers the playback position when the sound is paused, so it can continue from where it stopped instead of starting from the beginning every time.

### Features

-   Play and pause background music or sound
    
-   Upload your own audio file
    
-   Volume control
    
-   Optional looping
    
-   Remembers playback position
    
-   Works with your own On / Off variants
    
-   Connect using the On Toggle event
    
-   No fixed visual style **(Fully customizable visually on your style)**
    
-   Lightweight and easy to set up
    

### How to use

Add the component to your project, choose your audio file, set the volume and loop settings, then connect it to your own visual component using Framer variants.

The audio logic stays inside the component, while the visible design stays completely yours.

### About autoplay

The component includes an Auto Play option, but modern browsers may block websites from automatically playing sound before the visitor interacts with the page.

For the most reliable experience, use a clear sound or music toggle and let the visitor turn it on.

### Support

If you run into any issues, find a bug, or need help setting it up, feel free to reach out.

**X:** [**@madebyakiio**](https://x.com/madebyakiio)

**Email: aakifahamed277@gmailcom**

### Save on Framer

Need a paid Framer plan for your next site? You can try these promo codes at checkout:

[**Framer Basic**](https://framer.link/slBBueu) **- 25% Off** Use code: `FRAMER25INFLUENCER`

[**Framer Pro**](https://framer.link/MvTKgmV) **- 25% Off** Use code: `PARTNER25PROYEARLY`

Both offers are for **yearly plans**.

[**→ Get Framer**](https://framer.link/q8OwDP3)

Tags: background music, background sound, sound, audio, music, sound toggle, audio toggle, music toggle, sound control, Framer audio

## Rank history [How rankings work →](/terms#rankings)

-   All · #610

## Details

- **Author**: Aki
- **Published**: 2026-08-19
- **Updated**: 2026-08-19
- **Added**: 2026-08-19
- **Categories**: Players

## More like this

-   [Cozy Video Card](/component/cozy-video-card) — 日香理 / hikari · $1 — A cozy card for your YouTube video
-   [A/B Audio Player Pro](/component/a-b-audio-player-pro) — Injamul Haque Somrat · $24 — Master Audio Comparison Player
-   [Reelflow](/component/reelflow) — Quaders · Free — An auto video ticker for reels
-   [Mux Video](/component/mux-video) — NorthGarden · $3 — Drop Mux video into any Framer site with full control over playback, UI, and interaction.