Noise filter effect with transparency

Question

Is it possible to have a noise filtered effect similar to below, but have the white parts transparent?

My idea is to use this as a CSS background image overlay .png which would allow background colours to show through.

Answer 1

For Transparent Noise

1. Create a new layer with the desired left over noise color you want.
2. Add a mask to the layer in step 1.
3. Go to: Filter -> Noise -> Add Noise.
4. Select the desired amount of noise and click "OK".
5. Repeat steps 3 and 4 until the final amount of transparent noise is desired.
6. (Optional) Select your layer from step 1 and apply an opacity, to reduce the noise effect.

Answer 2

Another quick way to do it in Photoshop is to:

1. Create a new Document (with a white background)
2. Create a new Layer (Cmd+Shift+N)
3. Apply the Filter > Noise filter and set it as you like
4. Double-Click the (New) Layer or select Blending Option in the Layer Panel/menu
5. Set the Blend If This Layer's white point value to around 213—222
6. Hide the Background layer
7. Save for Web... PNG-24 with Transparency On

TIP: You can OPT+Click/ALT+Click on the white point to split it into a range

Answer 3

It is much better to use Fireworks. All you need to do

1. Save or export the noise texture as gif
2. Select the background object.
3. Browse to the texture by clicking the "Texture" dropdown
4. Turn on the transparency by checking the "Transparency" checkbox
5. White pixels in the noise texture will disappear
6. Optional - Set the % value to set "Amount of Texture" overlay the background

Screenshot - http://cl.ly/image/2h443A131p3k

Answer 4

There is a method that pretty much allows you to do this without thinking at all:

---

In photoshop:

1. IF necessary, Ctrl+L and bring the upper white arrow to the center enough, so that you will get white background ( Also, you might want to bring the top black arrow towards the center to make the black colors black ) ( This step is not necessary in this case ).
2. Select the Brush tool.
3. From the top menu: Edit > Define brush preset ( Since the Brush tool was selected ), the created brush will straight away be selected.
4. Create a new document Ctr+N without the background color ( make it bigger than the original image, so you don't have to aim much ).
5. Click D ( to default the foreground color to black ).
6. Click once in the document to place the image in the brush.
7. From the top menu: Image > Trim > Base on: Transparent pixels

---

It may seem like this has big amount of steps, but you can do this very, very fast.

Answer 5

I built on Kerry's method, works great:

1. Create a white layer
2. Add the amount of noise you want to it
3. Invert it, flatten it
4. Copy the layer to your clipboard
5. Create a new black layer (or any color you want)
6. Add a layer mask to it
7. Alt+Click the layer mask so you can edit it
8. Paste, return to normal view

Voila! A layer with a mask which imitates noise

Answer 6

Just found this webapp: http://noisepng.com/

It's exactly what you need, it generates transparent noise background and it has a lot of settings.