Macromedia Fireworks: How to Create a Metal Horizontal Menu

In this Macromedia Fireworks tutorial I will show you how to create the metal horizontal menu in my image. Please see the image that I have provided to see the ending results. There are a few steps to creating this menu. This metal menu really isn't that hard
 to make, it just takes patience. I will write this tutorial in detail so that the new Firework users can create this metal menu too.

How to Create a Metal Horizontal Menu in Macromedia Fireworks

The first step is to create a new canvas to work on. If you just opened Fireworks, a window will pop up and ask what do you want to do. Click on Create a New File. Then enter the size canvas that you want. 500 pixels by 500 pixels is a good size canvas for creating this menu. You can crop the menu at the end. Set the background color to the color that you need. Then click the OK button. If you already have Fireworks open, click File > New to create a new canvas.

You will see your new canvas in the Fireworks window. Make sure that the view is at 100%. Sometimes when you open Fireworks and create a new canvas, it will drop the view to 60%.

Next, you will need to select the Rectangle Tool from your toolbar and draw a horizontal rectangle. The length will depend on how many buttons you will need. You can always stretch it as you go.

Next, we will need to apply a gradient effect to the rectangle. Look down in the Properties box and drop the Solid box down. Then click Gradient > Linear. Now this is where is will get a little complicated if you are new to Fireworks. You will see the Gradient Color where the solid color was. Click the box to open your Gradient box. Now you will need to add another color to the Gradient. Click in the middle of the box to add a color. Now you should see three arrows on the gradient box. Now you will need to change the three colors. The middle color will be white. The two end colors will be #CDCDCD. Click on your canvas to close that box. Please see image 2 if you do not understand this step.

Related information
  • Once you have finished with the lines, you can start adding your text for your links.
  • After you add your text, you can crop your canvas and export it.