---
title: "Perspective - Audio"
description: "An audio component that Designers can use to play and pause sound clips in the browser."
---

# Perspective - Audio

> An audio component that Designers can use to play and pause sound clips in the browser.

![](component-example.png)

**Component Palette Icon**:  

![](2022-03-16_9-18-34.png)

:::info
The UI for this component is hidden by default and is browser dependent. There is a hidden property, `props.display`, which can be used to display UI for this component. In the event a user is displaying the UI (`props.display = true`), the component will be displayed differently based on the browser in use.
:::

## Description

 An audio component, hidden by default, that Designers can use to play and pause sound clips in the browser. 

### Supported Audio Files
Supported audio file types are browser dependent.

| File Type    | Browser Compatibility       |
| --------------- | ------------------------ |
| [3GP](https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Containers#3gp)  | Firefox for Android  |
| [ADTS](https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Containers#adts)   | Firefox  Available only if available on the underlying operating system's media framework.  |
| [FLAC](https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Containers#flac) | Chrome 56, Edge 16, Firefox 51, Safari 11   |
| [MPEG-4 (MP4)](https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Containers#mpeg-4_mp4)  | Chrome 3, Edge 12, Firefox, Internet Explorer 9, Opera 24, Safari 3.1|
| [Ogg](https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Containers#ogg) | Chrome 3, Firefox 3.5, Edge 17 (desktop only), Internet Explorer 9, Opera 10.50  Edge requires [Web Media Extensions](https://www.microsoft.com/store/productId/9N5TDP8VCMHS) to be installed. |
| [QuickTime (MOV)](https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Containers#quicktime) | Only older versions of Safari, plus other browsers that supported Apple's QuickTime plugin  |
| [Waveform Audiofile (WAV)](https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Containers#wave_wav) | Chrome 8+, Edge 12+, Firefox 4+, Opera 11.5+, Safari 4+ |
| [WebM](https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Containers#webm)                         | Chrome 6, Edge 17 (desktop only), Firefox 4, Opera 10.6, Safari 14.1 (macOS), Safari 15 (iOS).  Edge requires [Web Media Extensions](https://www.microsoft.com/store/productId/9N5TDP8VCMHS) to be installed. |

## Properties

Most Properties have binding options. For more information on Bindings, see [Types of Bindings in Perspective](ignition-modules/perspective/working-with-perspective-components/bindings-in-perspective/bindings-in-perspective.md).
This section only documents the Props Category of properties. The other Categories are described on the [Perspective Component Properties](ignition-modules/perspective/working-with-perspective-components/perspective-component-properties.md) page.

| Name          | Description        | Property Type  |
| ------------- | -------------- | -------------- |
| source        | The source URL of the media file.| value: string  |
| play          | The play state of the media file. Toggling this property will start or pause the media file.      | value: boolean |
| loop          | Determines if the media file should loop after reaching the end.      | value: boolean |
| volume        | The percentage of maximum volume (from 0 to 100).       | value: numeric |
| playbackRate  | A double that represents the playback rate of the media file.    | value: numeric |
| allowDownload | Determines whether the audio player allows downloading of the media file.  | value: boolean |
| style         | Sets a style that applies to the component. The [Style menu](appendix/reference-pages/style-reference.md) contains all the tools for modifying text, background, margins, and borders. You can also specify a [style class](ignition-modules/perspective/styles/style-classes/style-classes.md). | object  |

## Scripting
See the [Perspective - Audio Scripting](perspective-audio-scripting.md) page for the full list of scripting functions available for this component.