A configurable, resolution-independent HTML + SVG-based UI for playing collections of sounds.
Thanks to SonReal and Adrian Glynn for making these demos sound notably better.
Sample textures are from subtlepatterns.com. "If you need more, that's where to get 'em."
SVG icons are from IcoMoon, "Entypo" (CC-BY SA 3.0) and "IcoMoon Free" (GPL) sets.
Missing button images? Make sure your server is returning an appropriate MIME type for SVG assets. An .htaccess example: AddType image/svg+xml svg svgz
Color
Color opacity
Player texture
Page background
Font size
12 64Try combinations of color, opacity and texture.
CSS for these options:
.sm2-bar-ui { font-size: 16px; } .sm2-bar-ui .sm2-main-controls, .sm2-bar-ui .sm2-playlist-drawer { background-color: #2288cc; } .sm2-bar-ui .sm2-inline-texture { background: transparent; }
HTML for these options:
<div class="sm2-bar-ui"> <!-- player HTML goes here --> </div>
<div class="sm2-bar-ui fixed full-width"> ... </div>
below ↓