How to create a transparent drawing. How to create a PNG with transparency in Adobe Photoshop (CC and higher versions)? How to make a transparent background for a picture
Sometimes you need to upload an image that contains transparent elements that will allow the original background to show through. In these cases, it would be convenient to download PNG images since they are capable of maintaining transparency.
In this article we will tell you how to make transparency in Photoshop.
Creating a file
The first step is to create a file. To do this, open Adobe Photoshop and in the "File" menu ( File) at the top of the page select “Create” ( New).
Then in the window that appears “ new document » ( New Document) create a file of the desired size, and make sure the document resolution is 72 pixels per inch ( since the file is intended for use on the web). And also that you selected the value “Transparent" ( Transparent) in the “Background Content” drop-down list ( Background Contents).
*Before you make a PNG with transparency in Photoshop, you need to clarify that in this example we are creating an image to upload as a background for the site, so the document size is set as follows: width 3000 pixels, height 1730 pixels, which are the recommended sizes for HD image downloads:
After you have set the parameters, click "OK" to open a new document.
Then in the “Layers” panel ( Layers) make sure you are working on the transparent layer and not the background one:
Once you've completed your creation and are ready to save your transparent image, depending on the version of Photoshop you're using, from the File menu ( File) you can use one of the possible options:
Photoshop versions earlier than CC 2015:
Now we will tell you how to make a picture transparent in Photoshop, which came out before CC 2015. These versions use the "Save for Web" method ( Save for Web & Devices) to save and optimize PNG images for use on the web. To use this method, simply go to the "File" menu ( File), and then “Save for Web” ( Save for Web & Devices):
Then in the window that appears, select PNG-24 from the drop-down menu of possible values, and then make sure that the “ Transparency" options are selected ( Transparency) And " Convert to sRGB» ( Convert to sRGB). This confirms that the image will contain transparent background and its color mode will be converted to sRGB, the recommended color space for the web.
Fields " Image Size» ( Image Size) are automatically filled with the values you specified when you created the file. But if you want to change the file size before saving, you can do it now.
Photoshop version CC 2015:
Before, how to make a photo transparent in Photoshop, you need to know that from version CC 2015 the option “Save for Web" ( Save for Web & Devices) in the "File" menu ( File) is marked Legacy. And replaced by a new option “Export" ( Export), which offers identical functionality with faster saving to a smaller file and to best quality. To use the "Export" option, click the "File" menu ( File), and then - " Export as» ( Export As).
Note: Adobe still offers a "Save for Web" option ( Save for Web & Devices) in Photoshop CC 2015, and it is accessible through the File > Export menu ( File > Export) or using the keyboard shortcut Command+Option+Shift+S (for Mac) or Ctrl+Alt+Shift+S (for PC):
Then in the window that appears, select PNG from the “Format” drop-down menu ( Format) and make sure the Transparency options are selected ( Transparency) And " Convert to sRGB» ( Convert to sRGB).
Hello dear visitors. In this lesson I will show how using Photoshop you can remove background and make the photo transparent. You don’t need any special knowledge of this Photo Monster, as everything here is very simple. The main thing is that you have Photoshop installed and you repeat all the steps after me.
So, how to make a transparent background in Photoshop?
Launch Photoshop and open the experimental photo. Click the File – Open menu and specify the location of the image.
Great, the photo is open and let's start cropping the background. First of all, we need to unlock the layer. Pay attention to the lower right corner of the program. There you will see the main layer of our photo and small padlock.
This lock needs to disappear, that is, the layer is unlocked. To do this, straight to the lock make one click with the left mouse button. And the lock is gone!
Now we need to remove the background. To do this, take some kind of selection tool, for example, Magic wand.
Click the tool on the background of the photo, thus selecting the object we do not need.
A dotted line appeared (running ants). All you have to do is press the DELETE key on your keyboard and the background will be deleted. See how it turned out:
Super! Now deselect it by pressing the keyboard shortcut CTR+D.
Well, in general, how make a transparent background in Photoshop We figured it out and now all that remains is to save this photo correctly.
To do this, click the menu File – Save for Web. Or just use ALT+SHIFT+CTR+S.
You will see a window in which we must select the PNG-24 format and only then click the Save button.
Now look what happened and what has become:
Finally, it’s worth saying that in some cases, when you decide to make a transparent background in Photoshop on some picture, you may have to use other selection tools, for example, Pen or Magnetic Lasso. I used the tool Magic wand, since in my photograph the person was easy to separate from the background. If you remove the background from complex images, you will have to work a little harder.
That's all for today, good luck!
Take a look at the drawing in format jpg, the well-known cartoon character Baby Mammoth who lost his mother.. I want to cry.. no, not because the baby mammoth can’t find his mother (although because of this too), but because the blue background hurts the eyes terribly! I just want to remove this blue and fill the background of the picture with such a color that it merges with the background of the page..
I think this is not a problem for you! Just think about opening it using the same Photoshop and filling the background with the desired color! but what if the main background of the page is some kind of complex texture?
An example where an image is overlaid on top of a texture:
Open Photoshop and draw a picture with a baby mammoth instead of a blue background? And then try to match them to the main background of the page? This is not an option!!!
So, I report that graphic formats gif And png- support transparency mode, thereby allowing you to make some areas of the drawing invisible to the human eye - which is exactly what we need!
Now in order:
1. Open the picture whose background you want to make transparent using Adobe Photoshop.
2. Open a bookmark "Image" >> "Mode" >> "Indexed Colors".
3. In the dialog window that appears "Indexed Colors" put a tick "Transparency" and press "OK"
4. Using the Selection Tool "Magic wand" And "Eraser" We erase the background in the drawing, actually making the parts we need transparent.
5. Well, we save our image in the format gif.. bookmark "File" >> "Save for Web..." in the window that appears, indicate (agree) that the picture will be saved in the format gif click "Save".. select a folder and write the name - I hope you can do all this..
The entire picture has been created with a transparent background!!
Now you can paste it back into our page, without forgetting to change the extension jpg on gif .
gif" alt="Baby Mammoth"> !} Very often when creating greeting cards or videos, I was faced with the question: How can this be done? without knowledge photoshop?
Anyone who is familiar with Photoshop will do this without difficulty. But not everyone has studied this smart program yet. How can they be? Is there really no way out?
After all, there is always a desire to make our presentations, congratulations, and pages the most attractive and professional. I have already told you how to use the program for these purposes. It will help you make your pictures and you can even use it to make your first one.
And now I’ll tell you another secret: today you will learn how to make the background of a picture transparent. Moreover, you will do it absolutely free and spend only 2 minutes of your time.
Let's get down to business.
Find the picture you like. To begin with, it should be an image on a non-multilayered background - for example, on a white one. Go to the service page. You don't need to go through a tedious registration procedure. Just click on the online service link.
The following window will open in front of you:
Press " Upload an image from your computer". Select the picture you have prepared. You can place it in a separate folder in images. Or on the desktop, so as not to search for a long time. Click once on this picture and press " open".
The picture appears on the server page:
There are 3 windows coming out on the right and in the middle of them there is a padlock. Click on it 2 times with the left mouse. This will open the door to magic. 
On the left side you see the panel " Tools", one of which is that " Magic wand", which we will now use. Click on it once, and then click on any empty space in the background of the picture you selected. A dotted line will appear around the image.
The final step towards transformation: press the " Del" (delete) on your computer. The background becomes a checkered area. If not all the space around is covered by the checkered area, touch this place again with the magic wand and press the "Del" button
A window appears asking you: “Save the image before closing?” Click " Yes".
Today I decided to move a little away from the topic of coding and talk a little about the design. Although design plays a significant role in creating a website, I have not been friends with drawing, graphics and design since childhood. Therefore, I look for images for my posts, like many bloggers, somewhere on the Internet, using free photo banks and photo stocks.
And so, sometimes you come across a very suitable picture for your post and everything would be fine... But the background of the picture does not match the background of the blog or block with text. Apparently no one has this problem and no one has a white background, which would be suitable in most cases. I need transparent background!
I couldn't find any good ideas on the Internet. how to make a transparent background For finished picture, so I started experimenting myself and found a more or less suitable solution!
How to make a transparent background for a picture
Let's take one example a simple picture in .jpg format (in general the format is not particularly important):
There's a white background here that I want to get rid of and make a transparent background instead. Pixlr, an online version of Photoshop, will help us with this.
Uploading our image. On the right in the “Layers” window a “Background” layer will appear, on which there is a lock (prevents the background of the picture from being deleted).
By double-clicking with the left mouse button on this lock, you can remove the lock from the background. A checkmark will appear instead of a padlock.
Now take the magic wand (toolbar, right column, second button from the top), specify the following parameters: tolerance = 21, checkboxes for smoothing and continuity(usually such parameters are standard), although you can experiment with the parameters; and click on the background of the picture (in our case, on the white background).
Now we delete the background by pressing the “Delete” button and get the image we need with a transparent background.
