: Illustrator Vector Graphics Appearing Pixellated This has been puzzling me for a few days now, and I asked a graphic designer I knew before trying here and haven't been able to solve it yet.

@Pierce403

in preferences, go to general and check "anti-aliased artwork"

Vote Up Vote Down

@Chiappetta793

Was searching this question out, and I know it is several years past now, but maybe someone else will be in the same shoes as I am.

This is the solution I found to work: Go to "Document Raster Effects Settings" in the Effect Menu. The resolution might be in 72, so change it to 300 (go ahead and tick the "Anti-alias" check box under "Options" while you're here). Then go to Edt > Preferences > General and click "Anti-aliased Artwork."

Another thing to note, if you are using effects on your artwork, try to make the image the size it will end up being. For instance, I was making a logo for a band backdrop, but it was only 10" x 15" when the final product was 10' x 15'. My understanding of vector was that it didn't matter, but it does, to an extent, when you are using effects.

Hope this helps someone else a little late to the party...I know it was driving me crazy.

NOTE: All my instructions refer to Illustrator CS6.

Vote Up Vote Down

@Bethany839

With CC 2015, you have two preview options.

Under View, you will see GPU Preview or Preview on CPU.



To see a crisp high-res version, use the GPU Preview and not the Preview on CPU

This makes your vectors appear crisp on screen and not pixelated.
;)

Vote Up Vote Down

@Jessie844

A lot of good factual information here. One other thing to try is making sure your art is aligned to the pixel grid. You can do this when creating a new document:
- In the New Document window, click the arrow to open the "Advanced" settings. There's a checkbox for "Align New Objects to Pixel Grid".

Or, in your existing document:
- Open the Transform palette (Shift-F8). Select all your artwork (Cmd-A), then click the very bottom check box "Align to Pixel Grid".

This will mainly help tighten up straight edges, not as much on curves. But still a good habit to get into when using Illustrator to design for web.

Vote Up Vote Down

@Ravi4787994

go to View >

make sure the 'pixel preview' is off (unchecked)

Vote Up Vote Down

@Sims5801359

One thing Ozzyna didn't specify is if this logo is to be used primarily for print or for the web.

If it's for print, simply printing it to a laser printer or inkjet printer set to highest quality will confirm if the pixelation is in the art or in the output device (96ppi screen vs. 300ppi laser/inkjet).

If the hard copy output is visibly pixelated, something else is going on that we haven't addressed in our answers to you.

If it's primarily for screen, import the art into Photoshop at 2x or 4x final size and then scale it down in Photoshop, which does a great job of anti-aliasing (visually smoothing lines).

While Bicubic Downsampling is best for photographs, test them all when downsizing line art. Then File > Export to Web.

Compare a transparent image like a .gif or .png to one with a white background like .jpg - and be sure to use high to maximum JPEG quality when exporting.

Vote Up Vote Down

@Hamaas979

As Scott said the pixel size in your monitor is fixed so the pixelation caused by the limitations of the physical pixels is ever present. This pixelation is what you are seeing here.

However, when you zoom in the image is re-interpreted for the new display size. This results in more pixels inside the shape and thus they are smaller relative to the shape: and the edges of the shape appear smoother. Unlike magnifying a printed pixelated image the dots themselves do not get larger when you zoom in using Illustrator; causing an apparently smoother edge.

The cause behind the exaggerated pixelation in your image is the quality of your lines, namely thickness and sharpness. Due to how narrow the lines are compared to pixel size and how quickly they transition from full black to full white it is difficult to display them. When you zoom in even one step I assume you see a drastic improvement in appearance. This is because now there are that many more pixels to be used as explained above. If you were to soften the edges of the lines even a slight amount and thicken them as well you should be able to improve the edge quality.

A file with 300dpi is still limited by the display which it is viewed through. But a high density display will be able to take advantage of that extra information.

Vote Up Vote Down

@Caterina889

Your monitor (or any monitor) uses pixels to display anything. It's not possible for you to see anything on a screen unless pixels are used to display it. This is where you are seeing the pixels. Until some company somewhere invents a monitor which uses vector data to display content, you will need to become accustomed to pixels in every image. I wouldn't hold my breath waiting for such a monitor.

Vector data is smoother than raster data upon scaling and output, not upon display. If you ensure anti-aliasing is checked in the AI preferences, that's the best you can do since the monitor is still using pixels. You should see smooth edges when printed for vector data. And if using Save for Web, or exporting, you will want to ensure you choose the "Art Optimized" anti-alias setting within Illustrator to reduce the stair stepping of pixels as much as possible.

A retina display or monitor with a higher pixel density would smooth the edges more even though the artwork hadn't been touched. There's absolutely nothing you can do within any application to improve the pixel density of your monitor.

In short, this is the nature of digital displays. You can't remove all pixel indications, because the display itself uses pixels. Better monitors will show them less, but they are still present, at least until some massive innovation in display technology.

Vote Up Vote Down