Player customization

api.video enables you to customize the api.video player and match your brand's color scheme, as well as include your company logo with the player.

The three major aspects and importance of video player customization are:

  • Branding: Customizing the color scheme and adding your company logo to the video player can help reinforce brand recognition and increase brand awareness among viewers.

  • Professionalism: A customized video player with a consistent color scheme and company logo can help create a professional image for your brand and improve the overall look and feel of the video content.

  • Differentiation: A customized video player can differentiate your brand from others in the market, as viewers are more likely to remember and associate your brand with the video content they watch, which can lead to increased brand loyalty and engagement.

How to customize

There are two options to customize your player:

Add a custom company logo

You can add a clickable custom company logo to your videos.

Available customization options

Parameter NameDescriptionTypeDefault
nameThe name of the player themestring
textRGBA color for timer text. Setting the timer text colorstringrgba(255, 255, 255, 1)
linkRGBA color for all controls. Setting the player control colorstringrgba(255, 255, 255, 1)
linkHoverRGBA color for controls when hovering over. Setting the player control hover colorstringrgba(255, 255, 255, 1)
linkActiveRGBA color for the play button when hovered. Setting the play button hover colorstringrgba(255, 255, 255, 1)
trackPlayedRGBA color playback bar: played content. Setting the playback bar color for already played sectionstringrgba(88, 131, 255, .95)
trackUnplayedRGBA color playback bar: downloaded but unplayed (buffered) content. Setting the playback bar color for unplayed, buffered sectionstringrgba(255, 255, 255, .35)
trackBackgroundRGBA color playback bar: background. Setting the playback bar background colorstringrgba(255, 255, 255, .2)
backgroundTopRGBA color: top 50% of background. Setting the player's top 50% background colorstringrgba(0, 0, 0, .7)
backgroundBottomRGBA color: bottom 50% of background. Setting the player's lower 50% background colorstringrgba(0, 0, 0, .7)
backgroundTextRGBA color for title text. Setting the title text colorstringrgba(255, 255, 255, 1)
enableControlsEnabled or disabled player controls.booleanTrue
enableApiEnable/disable player SDK access.booleanTrue
forceAutoplayEnable/disable player autoplay.booleanFalse
hideTitleHide video title.booleanFalse
forceLoopEnable video loop by default.booleanFalse

Was this page helpful?

On this page