Open In App

How to Remove the Download Option from Audio Tag in HTML5 ?

Last Updated : 08 Feb, 2024
Improve
Improve
Like Article
Like
Save
Share
Report

The HTML5 <audio> tag is an easy way to add audio content to web pages. However, it comes with a download button that allows users to save the audio file. Sometimes, for various reasons, you might want to prevent users from downloading the audio file. To do so, you can disable the download option from the HTML5 audio tag by setting the “download” attribute to “false”. Instead, you can use standard playback controls with the “controls” attribute that will allow users to play the audio content, but not download it directly.

Syntax :

<audio controls controlsList="nodownload">
<!-- Your audio source goes here -->
</audio>

Using controlList to nodownload:

To remove the download option from an HTML5 audio tag, employ the controlsList="nodownload" attribute. This approach explicitly disables the download option in the default controls, ensuring a cleaner user interface for audio playback without the ability to download the file directly.

Example: Illustration of removing the download option from the audio tag in HTML5.

HTML




<!DOCTYPE html>
<html lang="en">
 
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0">
    <title>HTML5 Audio without Download Option</title>
</head>
 
<body>
    <h2>Audio Player without Download Option</h2>
    <audio controls controlsList="nodownload"
           src="audi.mp3"></audio>
 
</body>
 
</html>


Output:

vfg


Like Article
Suggest improvement
Share your thoughts in the comments

Similar Reads