---
title: "Audio On Click btn — Framer component · Best of Framer"
description: "$5.00 · Framer component · by Serafim 193 · Players. Screenshots, details, and remix links on Best of Framer."
canonical: "https://framer.elliotli.dev/component/audio-on-click-btn"
---

[Home](/)/[Components](/components)/[Players](/components/category/players)/Audio On Click btn

# Audio On Click btn

MUST HEAR AUDIO v2

[View on Framer](https://framer.com/marketplace/components/audio-on-click-btn/?via=elliot-li)

![Audio On Click btn preview image 1](https://framer.elliotli.dev/og/component/audio-on-click-btn/ffeda6b2a5dc4882/1600x1200.jpg)

## Summary

MUST HEAR AUDIO

## Description

The **Audio Button** is a playful yet functional component that lets you easily add sound feedback to your design. On click, it plays an audio file of your choice (MP3, WAV, etc.), and each time the user hovers off and then back on, the sound will replay automatically on click. This creates a dynamic and engaging interaction, perfect for making buttons feel more alive.

## Features

-   Plays any custom audio on click
    
-   Replays audio when mouse leaves and re-enters
    
-   Fully responsive and easy to restyle
    
-   Works seamlessly across desktop and mobile
    
-   Simple setup for changing the audio file and button design.
    

## Use Cases

-   Add playful sound effects to call-to-action buttons
    
-   Create audio feedback for notifications or alerts
    
-   Enhance gamified interfaces with sound interactions
    
-   Build prototypes with voice or music previews
    

!Important! if you add a audio that is 3 seconds long you must press on the "Playing on click variant" and then at the appear set the delay to the audio length

![](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-7r23byks-aVDBo86pkuVHf3JgY71yFBHpsdKBae)![](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-7r23byks-0lshdD7LpIxddTreF9yalSw9DCo7T9)

💡 **Have an idea for a component?** Send me an email at didaserafim90@gmail.com and maybe we can build it together.

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

-   All · #10760

## Details

- **Author**: Serafim 193
- **Price**: $5.00
- **Published**: 2025-09-26
- **Updated**: 2026-09-12
- **Added**: 2025-09-18
- **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.