0
0
HtmlHow-ToBeginner · 3 min read

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 muted attribute, so the video plays with sound.
  • Using muted="false" does not unmute; omit the attribute to have sound.
  • Not including controls can 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

AttributeDescription
mutedMutes the video audio when present
controlsShows video controls like play and pause
srcSpecifies the video file URL
autoplayStarts 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.