Creating Easy ButtonsOpen a new image of 150 X 150 X 16 million colors. Using your Selection tool , hit the control menu which will now show a drop down list of Rectangle, Square, Circle, and Ellipse. Select the Circle. Make sure the Antialias box is unticked, and your feathering is set to 0. Find the center of the image in the status bar on the bottom. it should read (75, 75) Starting at that point, make a circle that almost touches all sides of your image. This is the beginning of your button. If you would like, you can use the ellipse selection tool to get a more oval type button, but for now, I am going to create a perfectly round button. Select two colors from your color selector pallet. I used light blue (#98F3F4) or in RGB format: Red: 98, Green: F3, Blue: F4, for my foreground color. For the Background color, I used a dark blue (#07078D) or in RGB format: Red: 07, Green: 07, Blue: 8D. After you have picked your colors, click on your Flood Fill bucket , in this control window, select Sunburst Gradient. Click on Options on the control menu, this menu will now appear. Just input the numbers as I did here. Both should be set at 35%. This will give the appearance of a light shining from the upper left. this is also how you make Globes. Now fill your selected area. You now have a ball, globe, etc. You can go ahead and make this your button, or make a recessed button by continuing from here. Leave it selected, reverse your foreground and background colors by clicking on this symbol: Your Dark blue should now be on top of the light blue. Now, you need to set your recess up. Do this by clicking on Selections in the top menu, Modify --> Contract. Set your contraction to 10. Hit OK. This will bring the selection area (marching ants) in exactly 10 pixels from each point. Hit the Delete key on your keyboard. Now, your middle is missing, but that is what we want. Fill the still selected missing area with the sunburst gradient again. Now you have a Recessed button. OK! Cool beans, but I am sure you want it to look like it needs to be pushed, right? thought you did. Reverse your colors again so that the light blue color is on top. Using the same procedure above to remove the middle section (Selections in the top menu, Modify --> Contract. Contraction: 10. OK. This will bring the selection area (marching ants) in another 10 pixels. Hit the Delete key on your keyboard again.) Now fill the still selected missing area with the sunburst gradient again! And that is a button wanting to be pushed! The following pictures are other variations of the above, but using different filling techniques. Linear Gradient Buttons
Radial Gradient Buttons
|