Color Contrast for Player Accessibility

Color Contrast for Player Accessibility

Color Contrast:

Web Content Accessibility Guidelines (WCAG) 2.1 define how to make content more accessible to people with disabilities.

According to the WCAG, for contrast conformity at the mid-range level (AA), the visual presentation of text and images of text must have a contrast ratio of at least 4.5:1, except for large-scale text and images of large-scale text, which should have a contrast ratio of at least 3:1.

For contrast conformity at the highest level (AAA), the visual presentation of text and images of text must have a contrast ratio of at least 7:1, except for large-scale text and images of large-scale text, which should have a contrast ratio of at least 4.5:1.

To read more about these guidelines, click here.

In our hosting platform, our color pickers provide some helpful information about contrast. You'll see these color pickers throughout our site and settings, including:
  1. On the Interaction Tools tab under Interactive Buttons and Links for annotation buttons and call to action buttons
  2. On the Video Details tab under Player Customization > Player Color
  3. Withing Settings for Video Hosting  > Player Color
Our button text and player controls will automatically change to white (on darker backgrounds) and to black (on lighter or brighter backgrounds)!

To the right of the color picker, you will see the contrast ratio for your chosen color. 


Some of our color pickers, such as the those for call to action and annotation buttons, also offer transparency options.



Note: The contrast ratio displayed is calculated based on 100% of the color without any transparency. 

    • Related Articles

    • Inclusion and Accessibility

      Our commitment to accessibility. Screencast-O-Matic is dedicated to ensuring our products are inclusive and meet the accessibility needs of our diverse customers.  We believe in eliminating barriers in education and idea-sharing. We believe that ...

    • How to Remove the Background Color with Screencast-O-Matic (aka Green Screen or Chroma Key)

      Screencast-O-Matic allows a user to remove the background color of their screencasts, webcam video recordings, and image overlays with use of the green screen feature.  You can apply settings for color removal in either the screen recorder or video ...

    • Premier Hosting and Homepage setup for Solo & Team Premier subscribers

      Premier Hosting Settings Premier Hosting allows subscribers to personalize their viewer's experience. Channels and homepages can be fully customized with your branding. Branding options can include company name, company logos, video player colors, ...

    • Using Virtual Backgrounds

      You can use the virtual background feature in the Screencast-O-Matic desktop recorder to blur or replace your background. These virtual backgrounds can help keep your video background private, show your personality, minimize distractions or better ...

    • macOS Computer: Typing or Pressing keys on the keyboard will Start or Pause the Recording.

      If you are a Mac OS user (MacBook, iMac, MacMini), and are experiencing issues when using the keyboard during your recordings (the Screencast-O-Matic Recorder Start, Pause, Zoom), please try the steps below to troubleshoot.  1. Click the Apple Icon ...