# Audio-only player Tip: open your browser's developer console and use the `player` and `THEOplayer` variables to interact with this demo. With Open Video UI you compose a player from only the controls you need. This example uses a bare `` element with a track info area in the top chrome and a control bar containing just a play button, the current time, a seek bar, the remaining time, a mute button and a volume slider — no video area, center play button or fullscreen button. The video is hidden by styling the `media-layer` shadow part with [`::part`](https://developer.mozilla.org/en-US/docs/Web/CSS/::part), and the aspect-ratio box is removed with a CSS custom property, so no `display: none` overrides of individual controls are needed: ```css theoplayer-ui { --theoplayer-aspect-ratio: none; --theoplayer-height: 7.25rem; } theoplayer-ui::part(media-layer) { visibility: hidden; } ``` ```html
...
 ``` `no-auto-hide` on the controls keeps them visible at all times instead of letting them fade out when the player is idle, since there is no video to tap when the controls fade out. The empty element in the seek bar's `preview` slot replaces the default time preview that pops up while hovering or dragging the seek bar. Code demo.html ```html Audio-only player
Elephants Dream
Blender Foundation
 ```