Colors that represent disabled states for buttons

Sep 26, 2018

What colors is everyone using for disabled buttons? I wanted to use mustard yellow associating it with a yellow stop light. "Slow down, finish this before moving forward." Should I use gray or a muted blue instead?  

 

 

3 Replies
Stacey LH

I use either grey or a washed out version of the button because it seems that in most apps and forms on websites, a grey or washed out version of the buttons indicates that you can't click it yet, and I thought it made sense to roll with that. 

Edited to add: by "washed out" I meant knocking the transparency back as below. Words were not my friend yesterday!

Nancy Woinoski

 I also knock the transparency of the button back to indicate it is dead - usually set to about 30%. This allows for some visual connection between the active and disabled states.

The problem with making a disabled button a totally different colour is that it does not look disabled at first glance. Users will probably try to click it thinking it is active.

 

This discussion is closed. You can start a new discussion or contact Articulate Support.