<media-mute-button>
Button to toggle the sound. The icon responds to volume changes and acts as part of the typical volume control.
Default
<media-mute-button></media-mute-button>
Volume Off / Muted
<media-mute-button media-volume-level="off"></media-mute-button>
Volume Low
<media-mute-button media-volume-level="low"></media-mute-button>
Volume Medium
<media-mute-button media-volume-level="medium"></media-mute-button>
Volume High
<media-mute-button media-volume-level="high"></media-mute-button>
Alternate content
Default
<media-mute-button><span slot="high">High</span></media-mute-button>
Volume Off / Muted
<media-mute-button media-volume-level="off"><span slot="off">Off</span></media-mute-button>
Volume Low
<media-mute-button media-volume-level="low"><span slot="low">Low</span></media-mute-button>
Volume Medium
<media-mute-button media-volume-level="medium"><span slot="medium">Med</span></media-mute-button>
Volume High
<media-mute-button media-volume-level="high"><span slot="high">High</span></media-mute-button>
Attributes
Section titled AttributesNone
Slots
Section titled SlotsName | Default Type | Description |
---|---|---|
off | svg | An element shown when the media is muted or the media’s volume is 0 |
low | svg | An element shown when the media’s volume is “low” (less than 50% / 0.5) |
medium | svg | An element shown when the media’s volume is “medium” (between 50% / 0.5 and 75% / 0.75) |
high | svg | An element shown when the media’s volume is “high” (75% / 0.75 or greater) |
Styling
Section titled StylingSee our styling docs