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

    • Customize the video player

      With a Solo Premier, Solo Max, or Team Plan, you can easily customize the video player to match your personality, brand, or campaign. Please note that if you are a member of a Team Plan, your Account Owner or Administrator might choose to limit these ...
    • 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 ...
    • Remove background color (Green Screen or Chroma Key)

      You can easily remove the background color of your screencasts, webcam video recordings, and image overlays using our green screen feature. This feature is available from the Customize page, which is accessed from the screen recorder. In addition to ...
    • Recognize Text tool is not detecting any text

      When using the Recognize Text tool with screenshots and other images within the Image Editor, you might select text and receive an error that states, "No text detected".  This can happen when the text you are selecting is too small, or the selected ...
    • Set up hosting and homepage Solo Premier, Solo Max, and Team Plan 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, ...