Sunday, April 3, 2016

How to easily add transparency to an icon or graphic

Icons don't have to be extraordinary graphic endeavors, but a good icon can help your app or extension stand out, as well as build brand recognition.  Transparency (especially around the edges) makes many icons look more seamless and integrated.  If you want to add transparency to your icon, you can do it easily with Online Image Editor.

Adding transparency to your icon with Online Image Editor is simple, free, and should only take a couple of minutes:

- Navigate to Online Image Editor in your web browser

To open a file stored locally:
- Under the Upload tab near the bottom of the window, click Browse
- Find the file you want to work with and click Open
- Click Upload

To open a file from a URL:
- Click the From URL tab
- Type (or paste) the web address of the image file
- Click Upload

To start from scratch and create a new icon:
- Click the Create Canvas tab
- Choose your width, height, and background color
- Click Create Canvas

- Click on the Wizards tab
- Click Transparency

To make one color/area transparent:
- Click on the color or area in your image that you want to make transparent

To draw a transparent line:
- Select the radio button under Draw Transparent Line on the left
- Change the line thickness (optional)
- Draw a line over the image to apply the transparency

To make a transparent box:
- Select the radio button under Transparent Box on the left
- A red box will appear over your image; move it and resize it to the location and dimensions that you want
- Click Remove Area on the left

To save the file:
- Click Save on the left
- Choose Save Image Local
- If asked if you want to view or save the file, choose Save (otherwise, ignore this step)
- Browse to the folder where you want to save the image
- Click Save

No comments:

Post a Comment