Add Shadow to Image or Vector

Fireworks Tutorials

Add Shadow

How to add Shadows in Fireworks

In Adobe Fireworks there are two ways to Add a Shadow to a graphic (image or vector object) - The Drop Shadow Filter and the Add Shadow Command.

Drop Shadow Filter

The Drop Shadow filter is easily accessible via the Properties Window in Fireworks. After selecting your graphic just click on the + button in the Filters panel in the Properties window. Here you will see the Shadow and Glow option in the listed filters, hover over it and you will see the Drop Shadow filter in a second list, click it. The default shadow is applied to the graphic. You can edit the shadow by clicking the round blue icon (next to the tick) in the Filters panel.

Drop Shadow

Add Shadow Command

Sometimes the Drop Shadow filter is not sufficient for our shadow needs when we need the shadow to look a bit 3-Dimensional. The Add shadow command comes to the rescue here. This command automatically adds a shadow under the selected object based on the dimensions of that object. The add shadow is an Auto Shape with control points that you can use to control its appearance. You can drag the direction control point to limit its movement. By clicking, the direction control point you can resets the shadow to the original shape.

Create an object go to Commands >> Creative >> Add Shadow. Once you add shadow, you can change the shadow. To change the Direction and Perspective click the control points to restrain and reset its movement. Double-click the Direction and Perspective control points to reset the width of the shadow.

The image below shows how to apply the Add Shadow effect to a button.

The image below shows how to apply the Add Shadow effect to a navigational bar of links.

Software Required

Adobe Fireworks: Since this tutorial covers a core feature of Adobe Fireworks, any version of it will do.

Compatible Versions of Fireworks for this Tutorial

Fireworks CS6 Fireworks 4-8 | Fireworks CS3 | Fireworks CS4/CS5/CS6
Note: The features and instructions discussed in this tutorial are same across all Fireworks versions listed above; Screenshot images may differ. Recommended Version: Fireworks CS6
Please like, +1, link to and share this SmartWebby resource if you found it helpful. Thanks!