Welcome to WebmasterWorld Guest from

Forum Moderators: not2easy

Message Too Old, No Replies

Photoshop help for a newbie

logo doesnt look good on a color background

9:45 pm on Aug 1, 2003 (gmt 0)

New User

10+ Year Member

joined:Mar 29, 2003
votes: 0

I have just had a logo designed for my site, I have a photoshop file on a transparent background as well as gifs and jpgs. I am having problems getting the logo to appear clean and sharp on a colored background.

On a white background the logo looks great, but on my webistes colored background the edges look frayed with white noise surrounding the intricate parts of the design.

What should I do to have the logo display cleanly on a coloured background?

9:49 pm on Aug 1, 2003 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Feb 21, 2003
votes: 0

Have the designer remove the white around the border.
9:58 pm on Aug 1, 2003 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:June 8, 2003
votes: 0

If you have only one color in the background, the problem should be easy to solve.
10:25 pm on Aug 1, 2003 (gmt 0)

Senior Member

WebmasterWorld Senior Member mivox is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:Dec 6, 2000
votes: 0

If you have a copy of Photoshop, you can open the photoshop file (assuming it's the original PSD file?), and just create a background layer behind the logo in a color that matches your site's background. Then "flatten" the image, convert it to Indexed Color mode, use the magic wand tool to select and delete the solid area of the background color, and then use the "Save for Web" command to export it as a transparent GIF.

It takes longer to describe than it takes to actually do it, by far... and the "halo" around the edge of the GIF image should now match the background of your site.

If that all sounds greek to you, ask the designer to do it. They should have provided you with a copy that matched your site background to begin with, if that's what you were going to use the image for.

6:47 am on Aug 2, 2003 (gmt 0)

Preferred Member

10+ Year Member

joined:July 6, 2001
votes: 0

Most logos are created with clean lines, many from vector graphics. If your Photoshop format logo on a transparent background appears to have jagged edges, perhaps it is from a "fade" effect that was applied to the outer edges of the original image, which would cause some of the white noise you described when converted to a .gif file.

The method mivox explained will work well unless a definite fade effect has been applied to the edges. If so, you may need to "feather" your selection (you made with the magic wand tool) a few pixels to soften and smooth the edges of the area you wish to preserve, and also add a degree of transparency that will display better when you place the color you want for your background behind it.

This works best if the original image is a fairly large one.