Rev. A (1/2014) Creating Images with Transparent Backgrounds Graphic editing software such as Adobe Photoshop can be used to remove the background from GIF images; this is known as making a background "transparent." Images with transparent backgrounds will display only the desired portion of an image when layered with other graphic images or pasted on top of color backgrounds. In this example, only the image of the red Ford Mustang and the shadow beneath will be saved. The image will be cropped, and the background will be removed, or made transparent, using Adobe Photoshop CS4. Import or Paste the Graphic Image into Adobe Photoshop Existing images can be opened in Adobe Photoshop or copied and pasted into a new Adobe Photoshop file. Select the appropriate method from the two instructions below. Open an existing image file. Follow these instructions if the image has been previously saved in a graphic image format such as GIF, JPG, or BMP: 1. Open Adobe Photoshop. 2. Select Open from the File menu. 3. Navigate to the image. 4. Click to select the image. 5. Click Open. Paste a copied image. Follow these instructions if the image has been copied directly from another source such as a web site or document: 1. Copy the image from the original source. 2. Open Adobe Photoshop. 3. Select New from File menu. 4. Enter a file name in the Name box. 5. Click OK 6. Select Paste from the Edit menu. The image will appear in Photoshop.
Rev. A (1/2014) Creating Images with Transparent Backgrounds Page 2 of 5 Edit the image properties. To edit the image you will need to select RGB color properties, reset the file layers, and save the file in GIF format as detailed in the steps below. IMPORTANT Only files saved in GIF format can have their backgrounds removed by graphic editing programs such as Adobe Photoshop. 1. Select Image>Mode>RGB Color. 2. Right-click Layer 1 in the Layers window. Note: Select Layers from the Windows menu if the Layers window does not appear. 3. Change Layer 1 to Layer 0 (zero) in the Layer Properties Name box. 4. Click OK. 5. Select Save As in the File menu. 6. Select CompuServe GIF from the Format box drop menu. 7. Click Save.
Rev. A (1/2014) Creating Images with Transparent Backgrounds Page 3 of 5 Edit the image and remove the background. Use Adobe Photoshop s image editing tools to crop the image and remove the background. 1. Select the Crop tool from the Toolbar. Note: Select Tools from the Windows menu if the Toolbar does not appear on the left side of the Adobe Photoshop window. 2. Draw a box around the portion of the image to be saved. 3. Select Crop. Only the selected crop area will appear, as seen in the example below. 4. Select the Magic Wand Tool from the Toolbar (see image below left). The Magic Wand tool allows users to quickly select areas of similar color. 5. Select any part of the image background. A dotted line will appear around areas selected by the Magic Wand tool (see image below right). 6. Press the Delete keyboard key. 7. Continue this process until most of the background has been deleted. Note: Take care not to select or delete portions of the object to be saved.
Rev. A (1/2014) Creating Images with Transparent Backgrounds Page 4 of 5 8. Select the Eraser Tool from the Toolbar (see image below left). 9. Erase any remaining background items if necessary. The background will appear in gray and white checked format (see image below right). 10. Select Save for Web & Devices from the File menu. 11. Click GIF 128 Dithered in the Preset box. 12. Click to check the Transparency box. 13. Click Save.
Rev. A (1/2014) Creating Images with Transparent Backgrounds Page 5 of 5 The example below shows the 1965 Ford Mustang image inserted on top of a blue background before the background was made transparent. Image with Background The example below shows the 1965 Ford Mustang image inserted on top of a blue background after the background was made transparent. Image with Transparent Background