Graphic Design Stack Exchange is a question and answer site for Graphic Design professionals, students, and enthusiasts. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

In a web application that I'm building, I'm going to need several disabled buttons. I already have the enabled buttons and I want to know what the best and easiest way of creating a disabled version of that button. For example, when a user clicks the login button, I want to disable the button to show that the click has been registered.

I have paint and paint .net and if I had no other option I could use a friend's photo-shop.

Here's an example of one of the buttons: alt text

Can someone tell me the quickest, easiest way to create a disabled greyscale version of a button like this?

share|improve this question
What specific characteristics do you want the disabled buttons to have? Without any specifics all we can give you is what we assume you would want, such as just a grayscale of your image. – squillman Jan 14 '11 at 20:03
cool, that's exactly what I want, let me change the question, thusly. – Mark Rogers Jan 14 '11 at 20:10
up vote 3 down vote accepted

In Photoshop it's very simple. Here are the steps (in CS5, may be slightly different for other versions):

Image -> Mode -> Grayscale


alt text

share|improve this answer
+1, thx for great answer. I know this sounds stupid, but could you include the directions to do this in windows 7 paint. Nobody has to pay for it and it's really primitive, which many programs are. – Mark Rogers Jan 14 '11 at 20:32
It can't be done simply in MS Paint, unfortunately. You'd have to recolor everything by hand using shades of grey, which would be terrible around the edges of the button since there's also no way to defringe in MS Paint. – Matthew Read Jan 14 '11 at 20:35
Thanks, I just tried to do it myself and had the same results. – Mark Rogers Jan 14 '11 at 20:36
An alternative is Paint.NET which is a great image editor that is totally free. – Aᵂᴱ Jan 17 '11 at 12:42

Control+Shift+G or clicking Adjustments -> Black And White does the same thing in Paint.NET.

share|improve this answer
Paint.NET can be downloaded here. – Aᵂᴱ Jan 17 '11 at 12:44

My general impression of 'disabled' looking elements is they should be more a tone (added gray giving a dulled looked) or a tint (added white) of the original than a straight desaturate. (though they should probably be desaturated too)

share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.