How to Mute Video in HTML: Simple Guide with Examples
To mute a video in HTML, add the
muted attribute inside the <video> tag. This tells the browser to play the video without sound by default.Syntax
The <video> tag supports the muted attribute to silence the audio. It is a boolean attribute, so you just include it without a value.
<video muted>: Mutes the video sound.src: Specifies the video file.controls: Adds play/pause buttons.
html
<video src="video.mp4" muted controls></video>Output
A video player with controls that plays the video without sound.
Example
This example shows a video muted by default with controls so you can play or pause it.
html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Muted Video Example</title> </head> <body> <video src="https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.webm" muted controls width="320"> Your browser does not support the video tag. </video> </body> </html>
Output
A 320px wide video player with controls that plays the flower video without sound.
Common Pitfalls
Some common mistakes when muting videos:
- Forgetting to add the
mutedattribute, so the video plays with sound. - Using
muted="false"does not unmute; omit the attribute to have sound. - Not including
controlscan make it hard for users to pause or play.
html
<!-- Wrong: muted="false" does NOT unmute --> <video src="video.mp4" muted="false" controls></video> <!-- Right: omit muted attribute to have sound --> <video src="video.mp4" controls></video>
Output
First video plays muted despite muted="false"; second video plays with sound.
Quick Reference
| Attribute | Description |
|---|---|
| muted | Mutes the video audio when present |
| controls | Shows video controls like play and pause |
| src | Specifies the video file URL |
| autoplay | Starts playing the video automatically (often muted required) |
Key Takeaways
Add the muted attribute inside the
The muted attribute is boolean; just include it without a value.
Use controls to let users play, pause, or adjust the video.
muted="false" does not unmute; omit muted to have sound.
Muting is often required for autoplay to work in modern browsers.