How to Create a Transparent Image for Web in Photoshop
With Adobe Photoshop, it is finally possible to break out of the box. Saving a web file with transparency enabled allows you to create non-rectangular images. Photoshop features a built-in "Save for Web" option that will maintain the see-through appearance of any transparent pixels in your Photoshop file when you save it for use on the web. Two web file formats support transparency -- GIF and PNG.
Other People Are Reading
Instructions
-
-
1
Go to the "File" menu, and select "New."
-
2
Set your new document dimensions to the appropriate size, resolution and color mode for your project.
-
-
3
Select "Transparent" from the "Background Contents" drop-down list.
-
4
Click "OK."
-
5
Use Photoshop's drawing tools to make your image.
-
6
Go to the "File" menu. Select "Save for Web & Devices."
-
7
Select "GIF" or "PNG-8" from the drop-down menu at the top of the "Preset" box. Both file formats support transparency.
-
8
Check the "Transparency" box. If you want to blend partially transparent pixels with a specified color, click on the "Matte" drop-down arrow and choose a color. Select "None" from the "Matte" menu if you want all pixels with more than 50 percent transparency to appear completely transparent and all pixels less than 50 percent transparent to appear fully opaque.
-
9
Click "Save" when you finish adjusting your settings. In the resulting dialog box, give your file a name and select the location to which you want to save. Then click "OK."
-
1
Tips & Warnings
You can your image as "PNG-24" with "Transparency" checked, which will allow multilevel transparency and make your image blend into any background. However, some browsers don't support this file type, and the transparent pixels may appear against a default background color.
