Your Ad Here Your Ad Here
Page 1 of 2 12 LastLast
Results 1 to 10 of 12

Thread: Transparent Backgrounds

  1. #1
    uNz[i]'s Avatar Out of order
    Join Date
    Mar 2003
    Over the time I've been with this forum, I've seen quite a few folks asking how to make the background of thier avatars transparent with Photoshop.
    I finally got off my butt and typed up a quick and dirty tutorial for our transparently challenged members.
    This is just ONE way of doing it. There are others which offer more options, but this is by far the easiest for Photoshop newbies.

    You will need:
    1. Photoshop 6, 7 or CS
    2. An image, preferably 80 Pixels High and 80 Pixels wide if it's going to be your avatar.
    3. The ability to read and use a computer.

    Okay, here we go...

    Open your image in photoshop.

    Use the magic wand selection tool to select the area you want to make transparent.
    Click on the Help Menu and select "Export Transparent Image"
    The transparency Wizard will open.
    ( Dont ask me why Adobe hid the transparency wizard in the Help menu. )

    Select the option that says "I have selected the area to be made transparent"
    Hit the "Next" button.

    Choose "Online"
    Hit the "Next" button.

    Select Gif (although .png's sometimes are clearer and have a smaller filesize. Play around and see which format is best for you.)
    Hit the "Next" button.

    Read the text and hit the "Next" button again.

    Tick the "Preview" checkbox so you can see how your image will look.
    Choose "Uniform"
    Tick the "Transparency" checkbox. Notice the background of your image has become transparent.
    In the Options area, select the page colour that the image will "sit" on.
    For example, if the webpage is black, choose Black from the dropdown list.
    If your not sure of the page colour just choose "None".

    Dither: I usually choose "None" but use the preview image and see what setting suits you.
    Click Okay.

    Give the image a name and save it to the directory of your choice.
    Click Okay.

    Choose whether you want the image to be interlaced or not.
    Interlaced means the image will display at low quality at first, then become clearer as the details are downloaded.
    Non interlaced simply means the image will load from top to bottom.
    Click Okay.

    Click the Finish button and your done.

    Happy Photoshopping!

  2. Guides and Tutorials   -   #2
    In Fireworks, select "Index Transparency" from the export options (under Optimize), and then select the color that you want to be transparent. Alpha transparency isn't fully supported in most browsers, so don't use it.

    In GIMP, use the transparency tool.

  3. Guides and Tutorials   -   #3
    Join Date
    Jan 2003
    United Kingdom
    ... Or you could click here.

  4. Guides and Tutorials   -   #4
    Join Date
    Oct 2005
    I have an issue regarding this on a site that is under rebrand right now ( ) and I can't fix the logo with the transparenty.
    Last edited by rakoon13; 10-14-2005 at 11:36 AM.

  5. Guides and Tutorials   -   #5
    enjoy_with_me's Avatar PriSon BrEaKer BT Rep: +45BT Rep +45BT Rep +45BT Rep +45BT Rep +45BT Rep +45BT Rep +45BT Rep +45BT Rep +45
    Join Date
    Aug 2006
    gr8 work many thnx

  6. Guides and Tutorials   -   #6

  7. Guides and Tutorials   -   #7
    sangos's Avatar T|-|E RE/-\PER BT Rep: +10BT Rep +10
    Join Date
    Dec 2006
    in a house..... Dum-a*s !
    nice TUT thxx for the help

    change it so i dont get my A** Kicked

  8. Guides and Tutorials   -   #8
    Poster BT Rep: +18BT Rep +18BT Rep +18BT Rep +18
    Join Date
    Dec 2006
    tnx man..i need it

  9. Guides and Tutorials   -   #9
    You can also use the eraser, among other things.

    Open your image.

    Go to > Select > All

    Go to > Edit > Copy

    Go to > File > New

    - When the dialogue box opens make sure the 'Background contents' box says 'Transparent'. Click OK.

    Go to > Edit > Paste

    You can close your original graphic now and work on your new one.

    Select the Eraser Tool, (The 6th tool down on the left).

    Just rub out the bits you don't want, you can adjust the size of the brush in the toolbar.

    You can also use the Magic Wand to select areas, then press Delete.

    When you've finished, save your graphic as a GIF or PNG. (DO NOT SAVE AS A JPG!)

  10. Guides and Tutorials   -   #10
    FST.L0VeR BT Rep: +30BT Rep +30BT Rep +30BT Rep +30BT Rep +30BT Rep +30
    Join Date
    Apr 2008
    good work many thnx

Page 1 of 2 12 LastLast


Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts