Audio player skins

Nine skins, nine silhouettes —not nine colour swatches

A skin changes the shape of the player: where the artwork sits, whether the waveform decorates or seeks, how many controls there are, and whether it runs landscape or portrait. Pick the one that fits the page, then make it yours with artwork and brand.

Start free trialHow the player works
yourstudio.com.au/sessions/04

Session 04 · Guided audio

Breathing for the last ten minutes of the day

Press play and follow along. Switch the skin below to see the same recording in each layout.

Skin

Full-bleed artwork with the title and a glass control bar laid over it.

Illustration of each skin on a customer page — not a live embed

The short answer

What is an audio player skin?

An audio player skin is a complete layout for the player, not a colour theme. In DynTube each skin fixes the arrangement, the artwork treatment, the role of the waveform, the density of the controls and the surface material. Your accent, typography and artwork then sit on top, so the same skin still looks like your brand.

Choosing

Which skin should I use?

Start from where the player sits on the page, not from how it looks in isolation.

Inside a sentence or a dense article
Anything taller than a line breaks the reading rhythm.
On DynTube — Micro for a single inline pill; Bar for a slim strip between paragraphs.
A list of recordings or a sidebar
Rows have to scan and stay the same height.
On DynTube — Compact: thumbnail, title and play in one tidy row.
Spoken word people scrub through
Listeners hunt for a moment, so the seek control matters most.
On DynTube — Waveform: the waveform itself is the seek control.
Episodes or long-form listening
Artwork identifies the series; skip buttons save thumbs.
On DynTube — Podcast for a row with artwork beside a full transport; Card as the all-rounder.
A hero moment or landing page
The artwork is the design and should fill the space.
On DynTube — Cinematic: full-bleed artwork with a glass control bar.
Narrow columns and mobile-first pages
Landscape players get cramped; portrait frames fill the column.
On DynTube — Reel for full-bleed portrait art; Stack for a vertical card.

Designed for real libraries

What happens when a recording has no artwork?

Most audio libraries have gaps. The skins degrade on purpose rather than showing an empty frame.

Artwork-led skins fall backPodcast, Cinematic, Reel
Podcast and Cinematic render as Card when an asset has no artwork; Reel renders as Stack. The fallback is part of the skin’s definition, not an error state.
Stack draws a tonal panelStack
Without artwork, Stack’s top half becomes a designed tonal panel instead of an empty box.
Seeking always survivesWaveform, Reel
Where the waveform is the seek control and waveform data is missing, the player adds a progress bar so listeners can still move through the recording.

Questions

Audio skin questions

Can I change skins after I have embedded the player?

Yes. The skin is a player setting on the project or the recording, so changing it changes what the existing embed renders. Portrait skins use a taller frame, so if you switch between landscape and portrait, update the embed size on your page.

Do player presets include an audio skin?

Yes. A player preset can carry an audio skin alongside its colours and typography, so applying a preset changes the player’s shape as well as its styling. Player presets are a plan feature; check the pricing page for the plan you are considering.

Can a skin match my brand?

Each skin takes your artwork, accent colour, typography pairing and motion level. Those settings inherit from your brand defaults through presets and projects down to a single recording, so you set them once and override only where you need to.

Are audio skins the same as video player skins?

No. Audio skins are their own set, designed around artwork, waveforms and listening rather than a video frame. The video player has its own skins and presets.

Put one recording in three skins and let the page decide

Upload a real file and switch skins on a page you own. The right one is usually obvious within a minute.

Start free trialView pricing