A Stem Player Javascript Library for in the Browser

Our Stem Player is a Javascript web-component. Using HTTP streaming, it produces low-latency and high precision playback. The Stem Player can be used in any HTML document with or without Javascript frameworks such as React, Angular or Vue.

Responsive

The player is fully responsive and so adjusts the rendering automatically depending on the available space.

"Themeable" using css variables

The Stem Player can be "themed" to match the design of your website using CSS variables.


:root {
  --stemplayer-js-color: white;
  --stemplayer-js-background-color: black;
  --stemplayer-js-max-height: 400px;
  --stemplayer-js-waveform-color: blue;
  --stemplayer-js-waveform-progress-color: purple;
  --stemplayer-js-controls-color: red;
  --stemplayer-js-controls-background-color: blue;
}
  • Built as web-component
  • Can be used with or without Javascript Frameworks such as React or Vue
  • Use of HTTP streaming protocol produces fast load times
  • Simply serve audio assets over HTTP using your preferred CDN
  • Fully Responsive
  • Themeable using CSS variables

Free

For open-source projects

Fork us on Github

Commercial

If the GPL license of the free version does not work for you, contact us to discuss a commercial license.

  • Support
  • Regular security updates
  • Regular bug fixes
Contact Us

Cloud

Free Trial. Simply upload your stems and create a shareable embeddable Stem Player.

Free Trial

Frequently Asked Questions

  • Can I use the Stem Player For Free?

    Yes, for open source projects the Stem Player is entirely free, under the terms of the open-source GPL license. For non open-source projects we can provide a commercial license.

  • How do I prepare my audio so that it can be played by the Stem Player?

    The player works using a form of HTTP streaming audio protocol. This is so that we can achieve quick playback, and a low memory footprint. See here for more info.

  • How do get the waveforms to display?

    The waveforms have to be pregenerated. This is so that the player does not have to download and analyse all the audio before displaying the waveform. See here for more info.

  • I already have a player. Can I integrate the Stem Player in our existing player?

    Yes. The Stem Player is a custom HTML component. You could (for example) show a Stem Player, after clicking a specific button on your existing player, and display this in a layer exactly you would do with ordinary HTML components. Using CSS variables, you can style the Stem Player to match your own design.

  • Is there an API?

    We are working on a API hosted by us. You can try it out now. Talk to us about your needs.

  • Can I self-host the API?

    Yes. We have created an API which you can self-host in your AWS account. It consist of several micro-services which will A) generate waveforms; B) transcode audio for streaming; and C) generate a Mix of audio which can be downloaded. The API can be used under the terms of the AGPL license, or is also available under a commercial license.

  • Can I download a mix?

    See "Is there an API"

  • Can I get support?

    Of course! Please contact us for help.