> ## Documentation Index
> Fetch the complete documentation index at: https://mintlify.com/videojs/v10/llms.txt
> Use this file to discover all available pages before exploring further.
# MuteButton
> Accessible mute/unmute button with volume level state reflection.
`MuteButton` toggles mute on and off. It also exposes a derived `volumeLevel` based on the current volume and mute state, enabling multi-level volume icons.
Requires the `volume` feature to be registered with the player.
## Import
```tsx theme={null}
import { MuteButton } from '@videojs/react';
```
## Basic Usage
```tsx theme={null}
import { MuteButton } from '@videojs/react';
function PlayerControls() {
return ;
}
```
### Custom Render
```tsx theme={null}
import { MuteIcon, UnmuteIcon } from './icons';
import { MuteButton } from '@videojs/react';
function PlayerControls() {
return (
(
)}
/>
);
}
```
## Props
Custom render prop. Receives the computed HTML props and current state.
Override the automatic `aria-label`. By default: `"Mute"` when unmuted, `"Unmute"` when muted.
Disables the button.
CSS class name or a function that receives state and returns a class name.
Inline style or a function that receives state and returns a style object.
## State Data Attributes
These attributes are reflected on the rendered `