Skip to content

Music Player Card

Interactive music player, fully custom

Music Player Card preview image 1

Summary

About this component Music Player Card is an interactive component that turns any audio content into an elegant, visually engaging experience.

Description

About this component

Music Player Card is an interactive component that turns any audio content into an elegant, visually engaging experience. You can connect images or videos as the cover, display the title and artist, and play audio files directly within the component. Designed for portfolios, landing pages, playlists, or editorial layouts, it gives you full control over design and interactivity while remaining fully responsive and no-code.

Properties

/ Media

  • Cover Media (Image/Video)

  • Image Source (File/URL)

  • Title

  • Artist

  • Audio Source (File/URL)

  • Audio URL (Direct audio URL: .mp3, .wav)

/ Layout & Style

  • Corner Radius

  • Border

  • Shadow

  • Padding

/ Colors

  • Title Color

  • Text Color

  • Time/Volume Bar FG

  • Time/Volume Bar BG

  • Icon Color

  • Mute Button Fill

/ Controls

  • Play/Pause Size

  • Skip Icon Size

  • Volume Control (Show / Hide)

  • Volume Icon Size

/ Typography

  • Title Font

  • Artist Font

  • Time Font

Use Cases

Music portfolios · Landing pages · Interactive playlists · Editorial layouts

Rank history How rankings work →

125015001750195448/149/49/2610/1811/9
  • All · #9376

Details

More like this