I think your logic is flawed. Hit area is not too small if you write the component as you’re supposed to, accessibly with a label which means clicking or tapping the label also ticks and unticks the check-box:

Also, if you find check-boxes annoying from a design perspective, put the check-box and its label into a pill. Simples!

Another problem you’re creating with your suggestion, is that you’re solely relying on colour, which is a huge NO-NO in accessibility. To be honest, even as a person with no disabilities I can’t tell which of those “toggle tokens” are on or off half the time, because the colours often don’t convey that info. White background vs green, blue vs white, it’s not as intuitive as you might think.

--

--

Pragmatic software engineer, editor, writer and occasional music critic. LEGO and Mac fan. Accessibility advocate. Life enthusiast. 10x+ Top Writer, 1M+ views

Love podcasts or audiobooks? Learn on the go with our new app.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Attila Vágó

Attila Vágó

Pragmatic software engineer, editor, writer and occasional music critic. LEGO and Mac fan. Accessibility advocate. Life enthusiast. 10x+ Top Writer, 1M+ views