Web drop shadow?

W
Posted By
wafflepunk
Apr 25, 2004
Views
352
Replies
7
Status
Closed
I’m trying to add a "floating" image to serve as the background for a table, that has a dropshadow to give it some seperation from the page background. I’d like the shadow to be unidirectional, so that it can be seen on both left and right sides of the image. I tried playing with the lighting direction but don’t like the results. I’m wondering if there’s a way to apply two drop shadows, one from each each side, to get the effect I’m looking for…?

Also, When I design this image with a transparent canvas, when I go to export the image to my page, the background is white, and hence blocks out a portion of the page background. I can’t make it a transparent GIF because I would lose the drop shadow effect. How do you pull this off? I see it all over the place…

Master Retouching Hair

Learn how to rescue details, remove flyaways, add volume, and enhance the definition of hair in any photo. We break down every tool and technique in Photoshop to get picture-perfect hair, every time.

L
larry
Apr 25, 2004
Not sure about two shadows as I’ve never experimented with it because it wouldn’t look natural.

But as for the white area around the shadow. You need to add canvas the same color as the page it will be used on, not white. Create your drop shadow on that page color. Then it will blend in.

Larry Berman
W
wafflepunk
Apr 25, 2004
Hmm, ok well I’m using a tiled background watermark, not just a plain color. Any suggestions? I think it would be rather difficult trying to design a portion of the tiling into the image that would match up properly at all resolutions with the background…
L
larry
Apr 25, 2004
Try using the same color background for the canvas, as I suggested. Then flatten and convert to Index Color (Image>Mode) and in the Color Table use the eyedropper to pick the canvas color to be transparent.

Larry Berman
L
larry
Apr 25, 2004
Forgot. Then using Save For Web save it as a GIF with transparency checked.

Larry Berman
W
wafflepunk
Apr 25, 2004
"and in the Color Table use the eyedropper to pick the canvas color to be transparent"

I don’t quite get what you’re saying here…
JJ
John Joslin
Apr 25, 2004
I agree with Larry that two shadows wouldn’t look natural but, if that’s what you want, create a drop shadow as normal. Then right click on the drop shadow layer and select "Create Layer". This will put the drop shadow on a layer of it’s own called "Layer 1’s Drop Shadow". You can then add another drop shadow at a different angle.

Creating a layer from a layer effect is a very handy way to achieve interesting results. The new layer can be transformed and filtered as any other layer, or masked with a gradient to give the impression of fading with distance for example.

Cheers – John
JJ
John Joslin
Apr 25, 2004
PS: You can see what I mean about detaching effects at www.johnjoslin.co.uk/Photoshop/Photoshop.html

Cheers – JJ

MacBook Pro 16” Mockups 🔥

– in 4 materials (clay versions included)

– 12 scenes

– 48 MacBook Pro 16″ mockups

– 6000 x 4500 px

Related Discussion Topics

Nice and short text about related topics in discussion sections