CSS Box Shadow properties from Photoshop drop shadow settings

Advert test


New Member
Is there any scientific way of working out what the CSS box-shadow properties should be to replicate (or approximate) particular Drop Shadow (and Outer Glow) effects settings in Photoshop?

i.e. given a PSD, how do you replicate the drop shadow with CSS (as opposed just copying the shadow and using it as a background image, which I can't do in this case)


New Member
Here is an example of using CSS to create drop shadow, not sure if its what your looking for or not?!

CSS Drop Shadow:
CSS drop shadow

Tips & Examples on Text Shadow:
Text-Shadow Exposed: Make cool and clever text effects with css text-shadow › Kremalicious
Thanks for those.
I have the drop-shafow implemented in CSS alright - I was just looking for a 'scientific' way of working out what the settings should be to recreate as close as possible the drop-shadow applied in a .psd - other than trial and error


New Member
MOH, I don't suppose you've found a solution / idea for this since your last post? It is DEFINITELY something I'd be interested in knowing. Have you discovered a 'formula' for this?