top of page

Creating Textured Background Images for Your Website Design


Creating Textured Background Images for Your Website Design

Deep textured background images are an easy way to make our website design stand out, and textures add an essence of grunge if the minimal look isn’t for you. Furthermore, using a website background image will also help frame your page and enhance your web design.

1. Open Photoshop and create a document that matches your Wix canvas size.



Textured backgrounds for web design 1

2. Color the first layer white, hexadecimal code: #ffffff.


Textured backgrounds for web design 2

3. Search the web for an image of a rough surface. It may be best to search for “cement wall” or something similar. Copy and paste that image over your first layer.



Textured backgrounds for web design 3


4. Increase the contrast to accentuate the highlights and lowlights. Then drop the opacity of that image to 40%.



Textured backgrounds for web design 4

5. Repeat steps 3 and 4 with a second image of rough surface.



Textured backgrounds for web design 5

6. If you’d like to add more colors, add some shades over your first layer.



Textured backgrounds for web design 6

7. Finally, flatten the image, save it to your desktop and import it onto the Wix editor.



Textured backgrounds for web design 7

As you see, the trick to textures is in adjusting contrasts and opacities. The more you create your own background images, the better you’ll get at customizing them just right.

Good luck!



Textured backgrounds for web design 8


By the Wix team


Make_an_Impact_Online.png

This Blog was created with Wix Blog

bottom of page