Hi all.
Unfortunately images are my weak point so i need some simple guidance with this please.
I have a repeating grey image at the top of the website. However when I put the logo on top, it’s white background is there. How do I make the white background transparent so the logo sits nicely on the grey colour.
I have attatched an image so you can see my dilemma.
Thanks in advance.
James
Ideally, open the original file for the logo (Photoshop? Illustrator?) and hide the background layer. Then save as a transparent image (such as gif or png).
If you don’t have the original file, or if you do but the white background is not separate, in Photoshop you can select all instances of a color (e.g. white) with the magic wand tool and then delete them. (To make sure the deleted areas end up transparent, first make sure the layer is not called “Background” in the Layers palette, so rename it first.)
If that’s too vague, there are lots of tutorials online for removeing a background in Photoshop, such as http://graphicssoft.about.com/od/photoshop/l/blremovebackg.htm
right on all counts ralph, couldn’t have said it better.
Assuming you don’t have the original files in PS or AI. or that they are already flattened and have the white integrated into them ( bad move), you could do the follwoing steps:
1)add a layer mask
2) copy a grayscale version of your logo into it
3) in this layer mask select the logo image
4) contract the selection by 2 or 3 pixels ( optional tweak)
5) fill selection with black
6) Adjustments->invert the layer mask
You have to use transparent png or gif image for this purpose. Don’t use jpg, because it does not support transparency. And also set the image background color to transparent when styling in your css file.