How do I make a gradient with transparency in Fireworks?

Rothe Blog Fireworks Logo
Not often do I learn something new about Fireworks. Granted, this may be one of the lowest areas of entries on this blog site, but I use Fireworks on a daily basis. The other day I realized something so simple that I can’t believe I didn’t notice it before, and it saves me a ton of masks on very basic vector shapes.

Gradients are a great tool to give a website color and interest, and simple usage can turn a couple of flat colors into a three dimensional area of interest.

In this entry, I am going to show you how to create a simple button. This button, our “More Info” button is pretty commmon on the web, I took mine from cue on the Tiger Direct website. The nice thing about this button is that it is completely scalable and editable at any time later on.

Being self taught, some things that seem so simple to other designers are things that I may have totally missed in my own training. Gradients with transparencies was one of them.

Let’s get started

Step 1: Open Fireworks, and choose File > New (New Document)

Step 2: Make your new document 77 x 24 pixels, set your resolution to 72 DPI, and set your canvas to “White”.

Here are some similar arcade posts

If you enjoyed this post, please consider to leave a comment or subscribe to the feed and get future articles delivered to your feed reader.


No comments yet.

Leave a comment

Your email address is never displayed and cannot be spammed. If your comments are excessively self-promotional you will be banned from commenting. Read our comment privacy policy.