Toggle Button - Inactive State Improvement

[trisha2710]

When a toggle button is Inactive and in On state, at a glance, the treatment applied to it looks like the toggle is in Off state unless user closely observes the position of the knob.
I would like to contribute my improvement design and request Clarity to apply the colors of On and Off toggle buttons of Active state to Inactive state and reduce the opacity of the colors to 45%, to make it appear Inactive. (See attached image)

[bbogdanov]

@colinreedmiller

[colinreedmiller]

I'd like a11y to take a look at this. If we decide to do it we should use a different color at 100% rather than the transparency the design suggests.

[scroniser]

As for whether or not it will meet accessibility conformance - it depends:

• If the element is coded with the 'disabled' attribute, it is exempt under the color contrast success criterion (1.4.11).
• If the element is not coded with the 'disabled' attribute, the transparency as demonstrated above is a violation of WCAG SC 1.4.11. Using transparency will make it more difficult to ensure it meets/exceeds the color contrast ratio.

Please note the discussions among the WCAG governing body, many of whom mention their experience/need for good color contrast. Most prefer compliant color contrast for disabled items and this may become a requirement in WCAG 3.0 (often referred to as Silver).