A tester with red-green colorblindness told me my error states were invisible, and my toggle switches finally make sense | Colorblind Friendly Design - The Design Community Hub
A tester with red-green colorblindness told me my error states were invisible, and my toggle switches finally make sense
I had been using red text and a green checkmark for form errors for a good while and felt pretty good about it. Then during a usability check about two months ago, a guy named Devin told me flat out that my error message just looked like normal text to him, and the green check next to it did nothing. That one line made me rethink the whole thing, so I swapped to a red exclamation icon plus the word "Error" in bold, and added a small underline to the field label so there was a shape change too. My toggle switches also got a little filled dot on the ON side and a dash on the OFF side so the position reads without seeing green vs gray. It took maybe an afternoon of work and now I keep the icon and label combo on every form I build. If you have a go-to pattern for showing error state that does not lean on red alone, what does it look like?