Then there are the images to fill the top of the bar. All of these images were put together in Photoshop 5. Create a new image 75 pixels wide by 25 pixels high, background transparent. When the Select Foreground Color dialog box comes up, set the picker on the left to HTML Picker. Fill the Background layer with the color.
Guides are non-printing.
They exist only to help us align things. Use the Type tool to create a new type layer by clicking once in the image window. In the Type tool dialog box, type in the word Red. This is our Up state button for red. Align the bottom of the layer with the horizontal guide, then center the layer over the vertical guide.