# Set custom font for all elements in floating mode

**URL:** <https://community.elfsight.com/t/set-custom-font-for-all-elements-in-floating-mode/25200>\
**Category:** Audio Player\
**Created:** [November 10, 2023, 4:06pm UTC](https://community.elfsight.com/t/set-custom-font-for-all-elements-in-floating-mode/25200 "2023-11-10T16:06:35Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![Max](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/max/32/710_2.png) [@Max](https://community.elfsight.com/u/Max)\
**Post date:** [November 10, 2023, 4:06pm UTC](https://community.elfsight.com/t/set-custom-font-for-all-elements-in-floating-mode/25200/1 "2023-11-10T16:06:35Z")

</div>

Although we do provide a list of fonts for you to choose for your widget, you might happen to need a custom code.

If that is the case, add the code below to Custom CSS field on your [Audio Player](https://elfsight.com/audio-player-widget/) widget’s Settings tab:

```auto
.global-style,
[class*='Playlist__Component'],
[class*='FloatingBar__StyledPlaylist'],
[class*='FloatingBar__Container'],
[class*='Small__Component-sc'],
[class*='Mobile__ButtonWrapper-sc'],
[class*='Mobile__InfoContainer-sc'],
[class*='ProgressBar__Component-sc'] {
  font-family: Calibri;
}

```

You’re welcome to set any other font, providing it is supported by your browser and added to your website.