Advertisement


How to create a noise texture like this website's


Question

How would I go about making a texture similar to the one used throughout this site:

enter image description here

Is it some kind of noise pattern?

2013/05/26
1
7
5/26/2013 2:58:00 AM

Yes, it's a noise effect that you can recreate using Photoshop or CSS. You can see it better in the background image of the website.


Noise Effect in Photoshop


You can recreate it by adding a noise filter to a colored layer.

Go to Filter > Noise > Add Noise..., and select the Amount.

enter image description here (Source)

Then use transparency to make it more subtle. You can also invert the layer colors if you want a light noise effect instead.


Noise Effect in CSS


There is also a CSS script that created noise. I haven't tried it but it looks really good, I didn't know it existed. It's called CSS Noise, and all you need to do is call it using a class:

enter image description here

2013/05/26
6
5/26/2013 2:54:00 AM