Graphic Design Stack Exchange is a question and answer site for Graphic Design professionals, students, and enthusiasts. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I've put some nice effects on a layer in Photoshop, and the effect is repeated across several layers. Now, I have to cut it up for the web, and I want to be efficient with how I display the effect.

For example, I had an outer glow for a quiz game I had to use for a bunch of images, and could be switched on/off. So instead of exporting each image with/without, I can just export it separately and use it/not on each image.

How do you separate the layer from its effects, so you can export only the effects?

share|improve this question
I was just thinking some styles can be made with CSS, no images required. You could do an outer glow using the box-shadow property. – Johannes Oct 17 '13 at 17:55
In an ideal world, for sure; but in one where we have to support IE8 and the glow has meaningful information, not so much. How I abhor IE. – jonallard Oct 17 '13 at 19:26
but you can support glows in IE with CSS3 Pie or Modernizr – Darth_Vader Oct 17 '13 at 20:57

Another way to do it would be:

  1. Create New Layer.
  2. Set Fill Opacity to 0%.
  3. Right click the layer in the Layers panel that you want to isolate layer styles from and select Copy Layer Styles.
  4. Right click the new layer and select Paste Layer Styles.

I only mention this method because the Copy/Paste Layer Styles has more than one use and could be helpful for your workflow in other tasks.

An even simpler method specifically for your case would be to just right click the layer, select Duplicate Layers.. and then lower the Fill Opacity to 0% on the duplicated layer.

Simplest of all.. set the original layers Fill Opacity to 0% and export/save it and then set it back to 100% if necessary; with this method the project file size would be smaller (assuming that you want to save it when finished).

share|improve this answer

How to separate layer styles on to their own layers? has the answer in the question. I also came across Photoshop Tip: Isolating Layer Styles that explains it with screenshots.

Select the layer. Go to Layer > Layer Style > Create Layers. There you go!

share|improve this answer
Your link may solve the issue in hand but can you post a little about the link encase the site goes down and to prevent a dead link? – Darth_Vader Oct 17 '13 at 16:35

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.