# Audio Player

> Add audio to your board by uploading files, generating audio with AI, or embedding audio from a URL. Play and control audio directly within your workspace.

Source: https://mockflow.com/docs/boards/components/audio-player-in-ideaboard

Available in:
                    

              Basic
            

              WireframePro
            

              MockFlow Board
            

              Bundle Plan
            

              Enterprise
            

The **Audio Player component** in MockFlow Board allows you to add and play audio directly within your whiteboard. Instead of switching between external apps, you can listen to recordings, voice notes, music clips, or presentations right where you're brainstorming. The audio appears as a compact player with playback controls, making discussions more interactive and keeping all content organized in one place.

## **How to add an Audio Player Component?**

1. In the MockFlow Board editor, click on the 'Add' icon in the top left corner.

1. This will open the components modal. Look for the Audio Player Component and add it to the canvas by dragging and dropping it.

![Adding the Audio Player Component - MockFlow IdeaBoard](https://assets.mockflow.com/docs/media/f1b10d5701ecddce95888802.gif)

Generate Audio with AI: By using ‘Generate with AI’, you can create audio simply by entering a prompt.

![Generating Audio with AI - MockFlow IdeaBoard](https://assets.mockflow.com/docs/media/e43a7238f1f1dd73d342d30d.gif)

Multiple options to import the audio: The Audio Player component allows you to import audio in three ways. Click ‘Select Audio’ and choose from the dropdown: Upload Audio, Select Audio, and Audio URL.

![Options to import audio - MockFlow IdeaBoard](https://assets.mockflow.com/docs/media/f156dc9ea913d63cce7efc56.gif)

Adding a title to the Audio Player component: By using the ‘Edit Title’ option from the quick toolbar, you will be able to add or modify the title of the Audio Player component.

![Adding title to the Audio Player component - MockFlow IdeaBoard](https://assets.mockflow.com/docs/media/2b9ce5fff61d9ac3cf567d04.gif)

**Changing the theme of the Audio component:** You can customize the theme of the Audio Player component using the 'Change Color Scheme' from the quick toolbar.

![Customizing themes in Audio Player Component - MockFlow IdeaBoard](https://assets.mockflow.com/docs/media/56add9e4b6b19e111ffb0516.gif)

Interacting with the Audio Player Component: You can use the ‘Interact with Component’ option to enable playback controls for the Audio Player Component. Once enabled, you’ll be able to play the audio and adjust the progress using the play bar.

![Interaction in Audio Player - MockFlow IdeaBoard ](https://assets.mockflow.com/docs/media/61634150dc84a2edd7f9a90a.gif)

Enabling the advanced Settings for Audio component: To access the advanced settings toolbar, click on the 'Toggle Advanced Settings' option from the quick toolbar. You can find advanced options like move and export.

![Advanced settings in Audio Player - MockFlow IdeaBoard ](https://assets.mockflow.com/docs/media/3794b0c65d7f823d31eb1665.webp)

**Using the Focus mode: **There’s a Focus Mode that hides all other components and highlights only the Audio component. To enable it, click the 'Focus' icon in the quick toolbar to enable it, and click the Close icon at the top-right to exit.

![Navigating to focus mode in Audio Player - MockFlow IdeaBoard](https://assets.mockflow.com/docs/media/7935bd2c8c1ce83918b1ae0e.webp)

Share component link with team: In Focus Mode, you’ll find a Share icon at the top-right corner next to the Close button. Click it to copy a unique link to the audio component view, which you can share directly with your team.

![Sharing the Audio Player component - MockFlow IdeaBoard](https://assets.mockflow.com/docs/media/a879d983ae259b2da2ee7698.webp)

If you want to add a voice recording like a comment, you can use the audio comment option for the same.