How to make a white background transparent in illustrator. Making a transparent PNG in Illustrator. Setting opacity for vector objects
How to make PNG with transparency in Adobe Illustrator? Very simple. We open desired file and go to menu File > Save for Web & Devices(Alt+Ctrl+Shift+S). In the window that opens, in the list Optimized file format select PNG and check the box Transparency(Transparency).
Then we determine which colors will be transparent. All colors present in the image are contained in the tab color table(Color Chart) and are displayed as colored squares. Select a tool from the toolbar on the left side of the window eyedropper(pipette).
Colors can be defined in two ways. The easiest way is to specify the color with an eyedropper directly on the image - after that the color will be highlighted on the color table with a dark stroke. If you know exactly which color should be transparent, you can select it directly on the color table by clicking the corresponding colored box. And in the first and second cases, if you need to select several colors, you need to work with the Shift (or Ctrl) key pressed. Now let's make the selected colors transparent. To do this, click on the icon Maps selected colors to Transparent(Make selected colors transparent). In the top image, this icon is circled and the red color is set to transparent. A transparent area will appear on the image, and the square on the color table will change its appearance - part of it will become a white triangle. Clicking the Maps selected colors to Transparent icon again will cancel the transparency of the selected color.
A few words about the method of setting transparency. The dropdown menu is responsible for it. Specify Transparency Dither Algorithm, in Russian - Transparency simulation algorithm (fig. below). There are four choices: No Transparency Dither - no algorithm, Diffusion Transparency Dither - diffuse algorithm, Pattern Transparency Dither - pattern-based algorithm and Noise Transparency Dither - noise-based algorithm. In the diffuse algorithm mode, the Amount slider becomes active, allowing you to change the diffusion value. What to apply in practice? Depending on the purpose and image. I always leave the default - No Transparency Dither.
Click Save - transparent PNG ready. The work was done in Adobe Illustrator version CS4, but all actions and keyboard shortcuts are relevant for earlier versions.
If the image had clear boundaries, then no further processing is required. In the case of using shadows or if the transparency borders are not quite clear, sometimes you have to tinker by re-opening the created transparent PNG in Photoshop and erasing one pixel of the image border with an elastic band. If the transparent PNG is made by someone else, and you need to use it, and the background color of the image is significantly different from the background color of the web page, then such edge processing is simply necessary. You will have to use the Pencil tool to align the colors along the edges, picking up pages close to the background. In this case, it is necessary to convert the image to RGB before processing, and at the end of it - back to indexed colors. The pictures show how this is done. The first picture is a transparent PNG, prepared for a red background (a rough red border is visible on a white background), the second is an enlarged border, completely removing which we get “teeth”.
I found free image SVG on the web. I'm experimenting with web design using SVG. The problem I have is that the background of the SVG is white.
How to uninstall/remove White background using Adobe Illustrator?
Answers
Brendan
Try the Direct Selection tool (shortcut A or the white mouse pointer in the toolbar) and see if you can click it.
If you can't select and remove it, chances are the white "background" isn't a background at all; rather it is the color of the artboard. For obvious reasons, it's white in Illustrator, but it's ultimately an arbitrary thing. If you really want to change the artboard color, you can do this.
Omne
Assuming there is a background, you should be able to select and remove it. You can achieve this with many different methods, one problem with SVGs is that sometimes they have many complex layers and groups.
First try to see if you can select it with the Direct Selection tool, if it is in a group then double clicking on the object will isolate it and you will be able to select it individually.
I don't understand why the magic wand tool doesn't work for you if it's the only object white color which should have worked...
Alternatively, you can try to find this object from your objects, look in the layer window.
Since this is a royalty-free SVG, it would be helpful if you could give us a link.
Jamix
Thanks, it turned out that my "background" was a black rectangle that I found in the "Layer" window.
Machei
A simple web tool that allows you to change colors vector image using the editor raster graphics
spnk.pl/svg-edit-colors/
Kurt
Please explain what you mean or how to use the tool you linked. Giving only a link without explanation is not welcome ...
Machei
Sorry, I didn't have time to explain it. My tool was created 2-3 days ago, you can remove the background (or other element) specified color using a raster graphics editor. Also I uploaded the tutorial on YouTube.
answeru
it's so easy, if you want to change the background of the SVG file, please visit the layers palette first, there you have to select the path you really want to edit, and after selecting that part (path) in the layers panel, click on (small vertical red line ) window) at the bottom of the window will make the background transparent and you're done.
The Photoshop program allows you not only to edit and eliminate defects in the photo, but to change the image beyond recognition. One of the interesting effects is the change in eye color. You will need - photoshop; - selected ...
Each person has photographs that help to resurrect in memory the most interesting, important, enchanting moments of life. And in our time, some of these images are stored in electronic form. What makes it possible to change something in them, ...
Sometimes camera owners want to make their photos unusual, different from the boring rectangular standard. Thanks to the capabilities of Photoshop, it is quite possible to make a photo oval, round or any other arbitrary shape. To you…
Very often, when processing images, it becomes necessary to remove some fragment or, conversely, add it. Perhaps this detail will decorate another drawing, or it has become superfluous in the original picture. Photoshop offers several ways...
Each user of this software product, how Adobe Photoshop, knows that in this program, with the desire and skill, you can create anything: retouch photos, create three-dimensional images, etc. The best gift for Valentine's Day...
Many are familiar with the situation when you came out well in the photo, but the background is uninteresting or boring. Or maybe you just want to change the background to make the photo original, more picturesque and brighter. Or experiment...
Removing the background from a portrait or photograph of an object is done if it clutters up the picture or if you need to transfer the object to another background. This operation can be carried out using a raster graphic editor like GIMP. Instruction...
Cutting out any element from a photo is not at all difficult, especially if you have the right programs. Some of them allow you to cut a photo along the contour in just a few mouse clicks. Instruction 1Open the Microsoft program ...
Adobe Photoshop is one of the most widely used image editing programs. With it, you can change the appearance, figure, and even "swap bodies." This application gives unimaginable scope for creativity. …
Sometimes, in order for a photo to look complete, a mere trifle is missing. It is worth rounding the edges of the photo, and the view is completely different. There are two ways to give your photo a little zest with soft, rounded edges6 or by using…
The ability to work in Photoshop gives you the opportunity not only to retouch photos and add beautiful color effects to them, but also to radically transform photographs, making them unusual and eye-catching. For example, you can from any…
Photoshop opens up great opportunities for you to create a variety of visual effects in photographs and any other images. With the help of Photoshop, you can simulate almost any phenomenon - for example, depict in any photo ...
In most cases, not only on amateur, but also on professional cameras, frames are obtained as a kind of semi-finished product - in order to achieve maximum quality and beauty of the image, photos need to be retouched, aligning ...
About flattening transparency
If a document or graphic object contains transparency, then in order to print such a document, it is usually necessary to perform a procedure called mixing. This procedure separates a transparent graphic into vector and raster areas. The more complex a graphic object becomes (as a result of mixing images, vectors, font, spot colors, paint overlays, etc.), the more complex the blending procedure and its results.
Flattening may be required when printing, or when saving or exporting to other formats that do not support transparency. If when creating PDF file If you want to keep transparency without flattening, save the file as Adobe PDF 1.4 (Acrobat 5.0) or later.
Note.
Transparency processing cannot be canceled after the file is saved.
When flattening, overlapped images are separated
Note.
Additional information For output transparency issues, see the Print Service Provider Resources page on the Adobe Solutions Network (ASN) (available on English language) available on the Adobe website.
File formats with transparency support
When you save Illustrator files in some formats, the original transparency information is preserved. For example, if you save a file in the Illustrator CS (or later) EPS format, the file will contain the original Illustrator data and EPS data. When you reopen the file, Illustrator reads the original data (without flattening). When you open the file in another application, the EPS (flattened) data is used.
If possible, save files in a format that supports native transparency. If necessary, such files can be freely edited.
Raw transparency data is saved in the following formats:
AI9 and later
AI9 EPS and later
PDF 1.4 and later (when Preserve Illustrator Editable is checked)
Illustrator flattens the illustration when you select any of the following operations.
Printing a file with transparency.
Saving a file with transparency in older formats, such as Illustrator 8 and earlier, Illustrator 8 EPS and earlier, or PDF 1.3 (for Illustrator and Illustrator EPS, you can choose to remove transparency rather than flatten).
Export a file with transparency to a vector format that does not support transparency (such as EMF or WMF).
Copying and pasting objects with transparency from Illustrator into another application with AICB and Keep Appearance checked (in the File Handling and Clipboard section of the Preferences dialog box).
Export to SWF (Flash) or use the Transparency Handle command with the Preserve Alpha Transparency check box selected. This command allows you to preview how the artwork will look after exporting to SWF format.
Note.
For more information on creating and printing files with transparency, see the Transparency document in the Technical Info/White Papers folder on the Illustrator CD. You can also find more information about printing and flattening files with transparency in the Adobe Illustrator user forum. This is an open forum with many tips and answers to questions, located at www.adobe.com/support/forums.
Setting transparency flattening options for printing
Choose File > Print.
On the left side of the Print dialog box, select Advanced.
Select a processing style from the Style menu, or click Custom to set flattening options.
If the image contains overprinted objects that interact with transparent objects, set the appropriate option in the Overlays menu. Color overlays can be saved, simulated, or deleted.
Note.
If the artwork does not contain transparency, the document is not flattened and the flattening options are not used. To define areas of an illustration that contain transparency, use the palette
You can set transparent area flattening options when creating, editing, or viewing flattening styles in Illustrator, InDesign, or Acrobat.
Backlight Options (View)
No (view in color)
Cancels viewing.
Rasterize complex areas
Highlights areas that will be rasterized to improve performance (depending on the position of the Rasters/Vectors slider). Note that the edge of the light area is more likely to have an unwanted seam effect (depending on printer driver settings and screening resolution). To minimize the problems associated with the effect of seams, check the "Clip out difficult areas" option.
Transparent objects
Highlights objects that are sources of transparency, such as partially opaque objects (including images with alpha channels), objects with blend modes, and objects with opacity masks. Also note that styles and effects can contain transparency, and overlapping objects can be treated as sources of transparency if they are affected by transparent areas or the overlap needs to be flattened.
All affected objects
Selects all objects affected by transparency: the transparent objects themselves and the objects they are applied to. Flattening transparency affects selected objects - their strokes or patterns will be stretched, some of them may be rasterized, etc.
Affected linked EPS files (Illustrator only)
Selects all linked EPS files that are affected by transparency.
Processed images (InDesign only)
Selects all placed content that contains transparency or transparency effects. This option is useful for service providers who need to see images that require special attention in order to print correctly.
Exploded patterns (Illustrator and Acrobat)
Selects all patterns that will be parsed if they contain transparency.
Stroke in curves
Selects all strokes that will be converted to paths if they contain transparency or if Convert All Strokes To Paths is selected.
Text converted to curves (Illustrator and InDesign)
Selects all text that will be outlined if it contains transparency or if Convert All Text To Outlines is selected.
Note. In the final version, the stroke and text converted to outline may look slightly different than in the original. This is especially true for very thin lines and very small text. However, transparency processing does not show these appearance changes.
Bitmap filled text and paths (InDesign only)
Selects text and stroke that have received a bitmap fill as a result of flattening.
All rasterized areas (Illustrator and InDesign)
Highlights objects and intersections of objects that will be rasterized because there is no other way to represent them in PostScript or because their complexity exceeds the threshold set by the Rasters/Vectors slider. For example, the intersection of two transparent gradients will always be rasterized, even if the Rasters/Vectors value is set to 100. With All Rasterized Areas set, the bitmaps(for example, Photoshop files), which have transparency, as well as rasterization effects - shadows and feathering. Note that this option takes longer to process than the others.
Transparency Handling Style Options
Name/Style
Specifies the name of the style. Depending on the dialog box, you can enter a name in the Name text box or accept the default name. To modify an existing style, you can change its name. However, the default styles cannot be changed.
Raster/vector balance
Specifies the amount of vector information to be saved. High values allow more vector objects to be stored, while low values will result in more vector objects being rasterized. With intermediate values, simple areas will be saved in vector form, and complex ones will be rasterized. To rasterize the entire image, select the most low value parameter.
Note. The amount of rasterization depends on the complexity of the page and on the types of objects superimposed on each other.
Resolution for line and text objects
Rasterizes all objects, including images, vector graphics, text, and gradients, at the selected resolution. Acrobat and InDesign allow a maximum resolution of 9600 ppi for a vector object and 1200 ppi for a gradient mesh. Illustrator allows you to use a maximum resolution of 9600 ppi for both line art and gradient mesh. Resolution affects the accuracy of intersection areas when flattening. The resolution of vector objects and text should be between 600 and 1200 ppi for high quality screening, especially when using serif fonts or small sizes.
Resolution for Gradient and Mesh
Specifies the resolution of Illustrator gradients and meshes that are rasterized as a result of transparency flattening. The range of values is from 72 to 2400 ppi. Resolution affects the accuracy of intersection areas when flattening. The resolution for the gradient and mesh should be between 150 and 300 ppi, as the quality of gradients, shadows, and feathering will not improve with more high resolution, but the print time and file size will increase.
Convert all text to outlines
Converts all object types (points, lines, and areas) to paths and removes all glyph information on pages that contain transparent areas. This setting ensures that the text width remains consistent when processing transparency. Note that selecting this option will cause small fonts to appear slightly thicker when viewed in the Acrobat window or when printed on low-resolution desktop printers. This setting does not affect print quality on high resolution printers or phototypesetters.
Convert all strokes to paths
Converts all strokes to simple filled paths on pages containing transparency. This option ensures that the width of the strokes remains consistent during transparency blending. Note that setting this option will cause thin strokes to appear slightly thicker, and the performance of transparency flattening may suffer.
Cut difficult areas
Ensures that the boundaries of vector and raster parcels will follow the outlines of objects. This option reduces the unwanted seam effects that occur when one part of an object is rasterized while another part remains vector. However, selecting this option may result in outlines that are too complex for the printer.
Note. Some print drivers handle raster and vector areas differently, which can sometimes cause color seams to appear. To minimize the chance of this problem, you need to turn off some color management settings in the print driver. These settings differ for each printer, more detailed information see the documentation for your particular printer.
(Illustrator only) Preserve Alpha Channels (Only in the Handle Transparency dialog box)
Preserves the overall opacity of flattened objects. When this option is selected, the blend modes are lost, but appearance processed graphical objects and the level of alpha transparency (for example, when rasterizing a graphical object onto transparent background) are saved. Preserving alpha channels may be useful when exporting SWF or SVG files, as both of these formats support alpha transparency.
(Illustrator only) Preserve Spot Colors and Color Overprints (Only in the Handle Transparency dialog box)
Preserves spot colors. In addition, this option preserves overprinting of colors for objects that do not contain transparent areas. This option should be selected when printing color separations if the document contains spot colors and overprinted objects. Clear this option when saving files used in page layout applications. When this option is selected, overprinted areas that interact with transparent areas are flattened, while overprinting in other areas is preserved. When you output this file in a page layout application, you might experience unexpected results.
Keep Overlay (Acrobat only)
Blends the color of a transparent image with the background color to create a color overlay effect.
View areas of a graphic object for flattening
You can highlight areas that will be affected by transparency flattening using the viewing options in the Transparency Processing Preview window. This color encoding information can be used to adjust transparency flattening options.
Note.
The Transparency Processing Preview window is not designed to accurately track spot colors, blend colors, and blend modes. For these purposes, the mode Color overlay preview.
In Illustrator, choose Window > View Flatten Results.
In Acrobat, choose Tools > Prepress> Flatten Transparency.
In InDesign, choose Window > Output > Transparency Flatten.
Displaying the Transparency Flatten palette (or dialog box):
From the Selection menu, select the types of areas you want to select. The options available depend on the contents of the graphic object.
Choose the information options you want: select a style, or (if possible) specify specific options.
Note.
(Illustrator) If flatten options are not available, choose Show Options from the panel menu to display them.
If your image contains overprinted objects that interact with transparent objects, set Illustrator's Color Overlay menu to the appropriate option. Color overlays can be saved, simulated, or deleted. In Acrobat, select the Preserve Overlay option to blend the color of the transparent artwork with the background color to create an overlay effect.
You can click the Refresh button at any time to view a version with the current settings. Depending on the complexity of the image, it may take several seconds for the image to appear in the preview window. You can also select the Automatically Update Indication option in InDesign.
Note.
To enlarge an image, in Illustrator and Acrobat, click the preview area. To zoom out the output, Alt-click or Option-click the preview area. To pan the preview, press the Spacebar and drag the mouse in the preview area.
Overview of the Plumbing Results Preview panel
The Preview options in the Flatten Results Preview panel are used to highlight areas that are affected by flattening. You can also use this information to set flattening options and to save transparency flattening styles. To display the palette, choose Window > View Pivot Results.
A. Palette menu b. Refresh button C. Selection menu D. Overlay menu E. Transparency processing options F. Preview area
The palette menu options allow you to control the speed and quality of the thumbnail. For the most quick view image command "Fast view". To add an All Rasterized Areas option to the Selection drop-down menu, select Detail View (this option is computationally intensive).
Note.
Note that the Blend Results Preview panel is not designed to accurately preview spot colors, color overlays, blend modes, and image resolution. To preview how spot colors, overprint colors, and blend modes will appear in print, use the Color overlay preview.
About Transparency Handling Styles
If you regularly print or export documents containing transparency, you can automate transparency flattening. To do this, you need to save the corresponding parameters in transparency processing style. You can then use these options for printing, and for saving and exporting files to PDF formats 1.3 (Acrobat 4.0), EPS and PostScript. They can also be used in Illustrator when saving files for earlier versions of Illustrator or when copying them to the clipboard, and in Acrobat they can also be used when optimizing PDF files.
In addition, these options control flattening when exporting to formats that do not support transparency.
You can select a transparency handling style in the More palette of the Print dialog box or in the format-specific dialog box that appears after the initial Export or Save As dialog box. You can create your own transparency flattening styles or choose the default options that come with the program. The default settings are designed to match the quality and speed of the flattening to the appropriate resolution of the rasterized transparent areas, depending on the application of the document.
When working with images, you have to separate flies from cutlets, i.e. background from the picture.
There are plenty of places to download great cliparts, most of which come with a white background. Of course, you need to get rid of it. I remembered four ways to do this. They will be discussed in this article.
Method 1
Remove the white background from the image using the Magic Eraser tool.
This is one of the simplest and quick ways performing such an operation. With the eraser selected in the toolbar, click on the white background. As a result, all white pixels will be removed and you will see a checkerboard background, which indicates the presence of transparency instead of a background.
But it may happen that in addition to the white background, pixels close to white may be removed from the image itself.
As you can see, in the image above, part of the sword and some elements on the knight's armor have been removed. There are two reasons for this unpleasant effect. Let's turn to the tool options panel.
1. Adjacent pixels. see if this setting is checked. Its absence indicates that all pixels of a similar color will be removed (which is why the above parts of the image have disappeared). Check the box and Photoshop will remove only those pixels that are in contact with each other.
2.Tolerance. Often the background consists of a whole set of shades, for example, the same white color. The higher the tolerance value, the more of these shades the program will remove. Most often, this refers to the border around the image (a small border of pixels left over from the background). Increase the tolerance and the border will get smaller and smaller.
There is one more useful command to remove the border: Layer - Edge Processing - Remove Border.
Method 2 Selecting the background with the Magic Wand tool.
The most important thing is to remember to unlock the background layer. I have already written about this more than once, but I will repeat it again. If there is a small lock on the layers palette, near the layer thumbnail, then it is locked. Double click on this layer Forms it into a new, which can be edited.
Now, with the Magic Wand selected, click on the background. It will stand out with "Marching Ants". It remains only to press the Backspace key. The chess background will reappear.
As with the magic eraser, pay attention to the tolerance and adjacent pixels settings. They work in a similar way.
Method 3
Briefly, it looks like this:
1. We have an image. We want to remove all the white so that only the transparent background remains.
2. Create a duplicate of the blue channel. Press Ctrl+L. The Levels window appears. We begin to move the sliders so that everything gray becomes as close to black as possible. In other words, we need to achieve such a result that what we want to remove becomes white, and the rest is black.
3. Now click on the thumbnail of the duplicate channel we created with the Ctrl key. A selection has appeared. Most likely, the selection will have to be inverted - press Shift + Ctrl + I. Now you can either press Backspace to remove the excess, or create a duplicate layer by pressing Ctrl + J to transfer the selection to a new layer. In my example, I added a texture, here's how it turned out:
Method 4
If in the previous methods, after deletion, a transparent part remained, now we will learn how to change to a different background. This method is associated with the feature blend modes Burn and Multiply.
So, in the figure below, we have the same knight on the left, and the texture on the right.
On the layers palette, place the texture at the top and set the overlay to Darken or Multiply. The knight was visible. But there is a catch. Some elements of the image that were also white became texture colors.
We'll fix it now. Add a layer mask to the top layer (with the texture). Taking the Brush tool, we begin to erase the texture from visible places. Carefully, slowly, as a result it turned out like this:
