Extract inner glow to separate layer?

Question

I've got a .psd that needs to be cut up for a site. There are multiple times where the artist uses solid-colored square blocks with an inner glow applied to it, and instead of cutting out each one as an image I'd rather just overlay the glow over solid colors. Is it possible to get a glow that goes from transparent to white instead of from a certain color to white?

Answer 1

Two ways:

The easy way -- Right click on the layer effect and select "Create layers" from the context menu. This rasterizes the layer effect(s) and moves it to its own layer. Note that when you choose 'Create Layers' PS does this for ALL effects attached to that layer; you can't rasterize them individually.

The slightly less easy way-- Select the gradient tool, then select the gradient itself from the top menu in order to open up the gradient editor. Set both of gradient colors to white, then set the opacity of the left color to 0%. Voila, a gradient that goes from transparent to white.

Answer 2

A possible way to do it (good for rectangles) is by using Blur (gaussian or motion blur). You'd first need to draw a white circle in the middle of a transparent canvas, stretch the circle to create an oval, and then apply a Filter > Blur > Gaussian Blur to it until you have the desired effect:

You could recreate a transparent to white gradient using Gradient Overlay. Right click on the layer > Blending Options. In Gradient Overlay choose Style: Radial, pick an existing gradient that goes from black to transparent and choose white for the solid color. You won't have that much control over the gradient, though, and I think it only works for perfect squares.

Alternatively, you could use CSS3 to achieve an inner glow effect.

Answer 3

Another way to do this is to create a white image with the glow as an alpha channel and export as PNG with alpha. The glow will remain white, and the alpha channel creates a transparency which allows the underlying color(s) to show through.

Note alpha PNG support is not universal across browsers.