: How to prevent small images from becoming pixelated and truncated I usually save my images (.png) by selecting an object followed by selecting the artboard and reselecting my object, then saving

@Voss6371140

There are two parts to your question. It is helpful to look at the pixel grid version of your artwork if you are working at a size where that matters. Go to View > Pixel Preview or alt+ctrl+y.
You should notice that your artwork is pixelated and the edges extend a little outside the small circle shape. This is because a circle does not look like a circle when you only have 15px to work with.

How to avoid cropping the artwork
After selecting your artwork, right click and choose Make Pixel Perfect. This will try to align the shape to the pixel grid as well as possible. You should see that most of the pixels now fit within the bounding circle. Importantly, on the sides that would be cropped.

How to avoid it looking pixelated
This is a doozy. Your shape IS pixelated. It is being rendered by a screen that can only render pixels.
At 15px X 15px it looks like a circle. When zoomed in closer, it looks like a bunch of pixels. The software cleverly handles the conversion for you by antialiasing, blending the foreground (red) to the background (white) to make the edges appear smoother at smaller sizes.
If the circle is to be reproduced at 15 x 15 then you should let the software continue doing this.

Vote Up Vote Down

@Voss6371140

Things you can try:


make the artboard 16x16px and center the circle
save the PNG with the 'Clip to Artboard' unchecked. This way only the object is exported, ignoring artboard limits which could affect your edges
save a larger PNG like 256x256px (there are options to rescale it visible in your screenshot) and scale the PNG back to 15x15 via CSS

Vote Up Vote Down