Translucent: see-through backgrounds for the masses

Right click and  Save Picture As...
Right click and  Save Picture As...
Right click and  Save Picture As...
Right click and  Save Picture As...
Right click and  Save Picture As...

Right click and  Save Picture As...

Right click and  Save Picture As...

Right click and  Save Picture As...

Looking for a semi-transparent background image for your site design? There are 16 of them available here for the taking, for the price of a link back to this page. Aren't I nice? ;) Don't like the colours? Follow the tutorial I wrote for Adobe Photoshop 7 below and make one yourself in the colour of your choice:

  1. Create a new image at 2×2 pixels in white.
  2. With the pencil tool, make a 1 pixel dot at the top left corner and another one at the bottom right corner of the image in the colour that you want to make semi transparent.
  3. Define the image as a pattern.
  4. Create another new image in white at 50×50 pixels.
  5. Fill it with the pattern you just made.
  6. Save for the web as a .gif and make the white pixels transparent.
  7. Save the image and voila! You just got yourself a semi-transparent background image. Easy, eh?

To incorporate the background, just add the following line into your stylesheet:

background: transparent url(imagename.gif);

Don't forget to change imagename.gif into your image name. That's it! Enjoy and have fun!

Right click and  Save Picture As...

Right click and  Save Picture As...

Right click and  Save Picture As...

Right click and  Save Picture As...

Right click and  Save Picture As...
Right click and  Save Picture As...
Right click and  Save Picture As...
Right click and  Save Picture As...

XHTMLCSS508
This page design is not for the taking.
Copyright © 2003 Firda Beka. Hands off!