Accessibility Canvas Apps

How to make a Power Apps image control accessible?

A frame to display a photo or an image
A frame to display a photo

Introduction to the image control

Image controls are used to display images in an app. Like if you have a gallery of users, and if you want to display profile pictures, you will use one inside a gallery. To learn about its properties, click here.

Screen reader

  1. Use the AccessibleLabel property to clearly indicate the image's purpose if the image is interactive.

Keyboard tabbing

  1. Set the Tabindex property to -1, unless the control is interactive.
  2. Set the FocusBorderThickness to a number greater than 0 if the control is interactive.

Color/contrast

  1. Set the FocusBorderColor with a contrast ratio of 3:1 with the background color if the control is interactive.
  2. Set the Color property with a minimum luminosity contrast ratio of 3:1 with the adjacent colors if the control is interactive. There are several tools available to analyze contrast ratios. Click here for one such tool. Images that are used for decorative purposes have no such requirement.

Recent articles

  1. Make a Power Apps text input control accessible?
  2. How to make a Power Apps button accessible?
  3. How to make a Power Apps label accessible

Leave a Reply