Examples · Podcast
Runtime Hours, a link in bio template for a podcast
Example page only: Runtime Hours is a made-up podcast, and so is everything on it.
Start your page free · Open the live example
Why it is built this way
There is no row of podcast-app buttons on this page, and nothing is lost. Runtime Hours gets by with two buttons and an email sign-up.
From the top: a photo header and the show name (this is the Nucleus layout), then the bio, "A weekly hour on the parts of software nobody demos." It promises a length, a schedule and a subject most shows skip.
Next comes the newest episode, named by number: "Listen to episode 148". Someone arriving from a clip lands on the thing they just heard about. "Every episode" follows for the full archive. A content section fills the space under the buttons with recent episodes, and email capture is enabled, so a listener who will not subscribe in an app can still leave an address.
The design suits a technical audience. Inter is the only typeface on the page, which makes it read like good developer documentation. The page is near-black (#060608) with grey text (#B9BEC6), and a clear blue (#3AA0E8) picks out the buttons and the photo's outline. A topo-field animated background drifts in the same blue at a calm speed and low intensity (22), enough to feel alive without pulling focus from the words. The buttons have square corners.
A show with a numbered back catalogue, and listeners worth reaching outside the podcast apps, fits this template well.
What is on the page
- Nucleus layout
- Fonts: name in Inter, bio in Inter, buttons in Inter
- Colours: buttons #3AA0E8 with #02141B text, background #060608, bio text #B9BEC6, profile ring #3AA0E8
- Square buttons
- Animated background: topo-field, #3AA0E8, calm speed, intensity 22
- Button 1: Listen to episode 148
- Button 2: Every episode
- Content section below the buttons
- Email sign-up
