• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers

Illustrator CC export for screens 1 pixel off in size

Explorer ,
Aug 29, 2018 Aug 29, 2018

Copy link to clipboard

Copied

This is a continuation of the issue that occurs in Illustrator CS6

Illustrator CS6 artboard exports 1 pixel off in size

Settings

  1. The images I'm exporting are using whole numbers for width, height, x-axis position and y-axis position from x:0, y:0
  2. The artboards are the exact size of the image: Object > Artboards > Fit to Selected Art
  3. The Object > Make Pixel Perfect trick did not work for me. I got an Illustrator message stating they were already perfect.

Tested

  1. File > Export > Export for Screens... (adds 1 pixel to height and width)
  2. File > Export > Export As... (does not add any pixels)
  3. File > Export > Save for Web (Legacy) (does not add any pixels)

Thoughts

This seems to only be an issue with the "export for screens" option. I'm guessing this is a bug that just hasn't been solved yet.

If anyone has any insights regarding solutions, feature requests, or bug fixes please add them in the comments.

Views

19.8K

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Community Beginner , May 14, 2019 May 14, 2019

I realize this issue was brought up last year, but I had the same problem and thought it helpful to share a potential solution. Making sure the artboard is aligned to the pixel grid as described at https://www.reddit.com/r/AdobeIllustrator/comments/3dqadd/1_pixel_off_when_exporting_artboards_to_png/ct9qm26?utm_source… fixed the additional pixel problem in my situation. Essentially, while using the Artboard Tool make sure the X and Y position values are whole numbers without decimals. Doing "Rear

...

Likes

Translate

Translate
Guide ,
Aug 31, 2018 Aug 31, 2018

Copy link to clipboard

Copied

If I create a New Illustrator document with Web intent and define an artboard size in pixels, exporting for screens gives me an exact artboard size: in other words, I can't replicate the problem in Illustrator CC (2018) and do NOT see an extra pixel in width or height.

I'm wondering if step 2 in your settings is the culprit – and possibly due to stroke weights and stroke positioning, there is a minuscule bit of 'rounding' occurring that when exported for screens results in a rounding up.

Are you able to provide some step-by-step screenshot examples of what you are doing?

  • are the document units of measurements set to pixels?
  • does the artboard size display an exact number of pixels?
  • etc.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Aug 31, 2018 Aug 31, 2018

Copy link to clipboard

Copied

Cari Jansen

  1. There are no strokes on my objects, but if there were I would Object > Path > Outline Stroke before exporting.
  2. I've seen the rounding issue you're talking about before, even posted about it: illustrator CC snap to anchor points off by 0.005 px , but the images below show this is not the case.

The object

illusrator-cc-top-bar_object.JPG

The Artboard

illusrator-cc-top-bar_artboard.JPG

Preferences

illusrator-cc-preferences.JPG

Steps to Reproduce

File > Export > Export for Screens...

illusrator-cc-file-export-for-screens_edited.png

Export for Screens

(some images and text censored)

illusrator-cc-export-for-screens_edited.jpg

Windows 10 Explorer > [right click newly created PNG] > Properties

(some images and text censored)

image-properties_edited.jpg

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
May 14, 2019 May 14, 2019

Copy link to clipboard

Copied

I realize this issue was brought up last year, but I had the same problem and thought it helpful to share a potential solution. Making sure the artboard is aligned to the pixel grid as described at https://www.reddit.com/r/AdobeIllustrator/comments/3dqadd/1_pixel_off_when_exporting_artboards_to_pn... fixed the additional pixel problem in my situation. Essentially, while using the Artboard Tool make sure the X and Y position values are whole numbers without decimals. Doing "Rearrange All Artboards" from the Artboards panel flyout menu was an automatic way to align the artboards to the pixel grid that also worked.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
May 17, 2019 May 17, 2019

Copy link to clipboard

Copied

I believe this may have been the issue. I confirmed that this occurs with artboards that are not aligned to pixel grids. Ones that are aligned to pixel grid do not seem to have this issue.

I was going to state that a 100px by 100px artboard should result in an image with the same dimensions, but then pixel grid would be more confusing. My more recent files I noticed don't have this issue, simply because I had been using "Rearrange All Artboards" as part of my regular process.

Thanks for updating this thread!

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Dec 03, 2019 Dec 03, 2019

Copy link to clipboard

Copied

Just as another addition, if you are working in measurements other than pixels (cm, in, pt, etc.), your odds of this artboard issue occuring increases.

 

I had a recent document where one of my artboards needed to have a decimal pt value. All the artboards that followed were then offset by that decimal value when doing "Rearrange all Artboards...".

 

Had to go back and manually move the affected artboards, so the top left XY values didn't start on a decimal pixel value.

 

For anyone wondering, this issue originated by iOS developer app icon image requirements where one image is defined as 83.5pt. Not a great measurement for Apple to use since @1x it will always have an anti-aliasing issue, even if they don't use that image size.

 

The problem is still caused by Illustrator poorly handling artboard coordinates, but I could see how few individuals would require this flexibility. Most people however discover this because of the problem it creates, not because they're looking for artboard manipulation.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Aug 09, 2019 Aug 09, 2019

Copy link to clipboard

Copied

This is the actual solution. Thanks.

Silly that half a pixel coordinate would make such an issue, but anyway... Tnx.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Aug 09, 2019 Aug 09, 2019

Copy link to clipboard

Copied

martinovski  schrieb

Silly that half a pixel coordinate would make such an issue, but anyway... Tnx.

Half a pixel just doesn't exist. Pixels can only be complete.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Aug 09, 2019 Aug 09, 2019

Copy link to clipboard

Copied

That's not helpful since I gave the solution to the problem above. There is a setting in Illustrator for artboard coordinates which can be set to any part of the pixel. Therefore your comment is completely unnecessary.

123.png

Set these numbers to whole numbers and the problem should go away.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Aug 09, 2019 Aug 09, 2019

Copy link to clipboard

Copied

martinovski  schrieb

Therefore your comment is completely unnecessary.

I was referring to your "silly" remark. Since half pixels don't exist and images can only contain whole pixels, your artwork has to be set up this way.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Aug 12, 2019 Aug 12, 2019

Copy link to clipboard

Copied

Monika Gause​ and martinovski
The only silly thing is arguing two different points in which you are both correct.

martinovski

You are correct in your statement that "half a pixel coordinate" is possible, and "half a pixel" taken out of the context of your statement would potentially be invalid, but within the context of your statement is valid.

Monika Gause

You are correct that "half pixels don't exist" in bitmap images and this does not conflict with the statement made by martinovski​.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Aug 17, 2020 Aug 17, 2020

Copy link to clipboard

Copied

This is really an annoying bug that should be fixed. Exported images should not vary its size depending on artboard position! 

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Nov 12, 2020 Nov 12, 2020

Copy link to clipboard

Copied

On average I waste 30 minutes of my time per workweek trying to figure out a workaround in a thousand + dollar software (per year) fo these errors that honestly are not justifiable. 


Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Feb 09, 2022 Feb 09, 2022

Copy link to clipboard

Copied

I have been testing out the Affinity products for a while and am hoping to make a full transition soon. Have you tried using Affinity Designer?

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Feb 09, 2022 Feb 09, 2022

Copy link to clipboard

Copied

It's kinda new, but I found it fast, handy and stable. I was able to re-work my last project even faster than in Illustrator.

 

It has outstanding control over export, better clipboard handling, easier interface (tried working with masks, creating curves, placing images, working with single- and multi-line text). Especially I love the SVG export, that just works and don't require you to fiddle with Inkscape after exporting. Splendid asset library with iOS 12 controls even in free version (in case you would use it for prototyping).

 

It lacks some Illustrator features wich we got used to for decades, but it's fresh and powerful. I'll stick to it on my next task, and maybe switch to it completely when I don't work on pre-press.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Advocate ,
Nov 24, 2020 Nov 24, 2020

Copy link to clipboard

Copied

I'm away from my desk hence looking up this issue without checking whether it is indeed this same old problem of art boards not sat at whole pixel locations. I'm guessing it is this as I see your answers are recent, but I presumed this issue must have been fixed by now as it's been years since it originated. I really wish they would actually fix stuff like this. They maybe assume the use case for these kind of outcomes is smalls so they just leave it for those people to work around it instead.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Dec 02, 2020 Dec 02, 2020

Copy link to clipboard

Copied

I can confirm that this is still very much a bug as I was just bit by it on a large project for remarketing ads. Ended up just saving for web on each individual ad because I just found this post/workaround today. While not ideal, it will be added to the thought bank for web workflow each time I start a new document now.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Feb 09, 2022 Feb 09, 2022

Copy link to clipboard

Copied

This made me look really bad at my job when I delivered the wrong file sizes. Turned out it's an illustrator bug for years now. Totally unexceptable. This can cost someone their job.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Feb 09, 2022 Feb 09, 2022

Copy link to clipboard

Copied

quote

This can cost someone their job.


By @zachg4140523

 

if that someone doesn't check their files before delivering them. Don't know about you, but that should be part of a thorough routine when preparing any file for production.

 

And since everyone refers to Affinity Designer: these are 2 different concepts of integrating artboards into an app. They both have their upsides and downsides. Illustrators artboard concept allows you to easily split up an artboard into pages. Try that with Affinity Designer.

 

If you don't position your artboard on exact pixels in Illustrator, the real issue is not the exported file getting 1 pixel larger, but the resampling, which causes blurriness.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Feb 09, 2022 Feb 09, 2022

Copy link to clipboard

Copied

quote

if that someone doesn't check their files before delivering them

Of course that's not correct: we should be able to trust our tools without further re-checking their output results.

 

If any dialog displays exact numers, they should be exaclty the same on the output. That shouldn't be a user's problem. We're professionals, it's not 'mobile shooting for stories'. It's design. We're spending tons of time doing EXACT things: colors, curves, profiles, etc. And we expect our tools to be the same exact, stable and predicatable.

 

When the software is working slightly incorrectly, it's just a sign of low quality code. There are a lot of bugs in glitches in Illustrator, despite it still stays the mainstream for vector graphics.

 

But that is the cause why many people who do not extra powers are moving to Figma or Affinity.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Guide ,
Feb 09, 2022 Feb 09, 2022

Copy link to clipboard

Copied

It's really no different than incorrectly - or not - setting your color settings and on export expecting Illustrator to know what you wanted.

If you do the same size regularly, or need specific settings different from your usual working practice, set up your document correctly and create a template.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Advocate ,
Feb 09, 2022 Feb 09, 2022

Copy link to clipboard

Copied

I appreciate what you and Monica are both saying, that it's always our responsibility but i think it is a little different, in that in this case, you set an art board at say 120px width and illustrator says it is, then if you export screens and choose 120px width, it all agrees with what you're asking then Exports a file that is not 120px width but 121px which yeah sure is  pretty much the same and we all now know that it's due to the art board being sat at a non whole number location, but it should just export 120px as the 'quick fix' Is just to open the image and crop by 1 pixel. Surely illustrator should just do the same thing. Or flag up that the art board is not set at whole pixels ? Or a check box on export that says 'force proportions for non whole pixels' or something, sure there are settings earlier in the process to avoid this issue but it remains a fact that illustrator does not do what it says it will, in that it exports at a size other than what it says it is going to. 

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Feb 10, 2022 Feb 10, 2022

Copy link to clipboard

Copied

quote

Or flag up that the art board is not set at whole pixels ? Or a check box on export that says 'force proportions for non whole pixels' or something, sure there are settings earlier in the process to avoid this issue


By @d0nut247

 

The real issue is not that the exported file is larger, the real issue is that you get resampling on top of that. So you want to work with correct settings and not just crop your exported file.

 

With these small sizes you are obviously designing for screen, so why don't you turn on snap to pixels when creating artboards?

 

If you want to make a suggestion to the developers, please use http://illustrator.uservoice.com

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Guide ,
Feb 10, 2022 Feb 10, 2022

Copy link to clipboard

Copied

If you're working on web projects, why isn't snap to pixel always on?

Once on, it stays on.

Illustrator can't guess your intent: if you later turn snap to pixel off, it assumes you know what you are doing.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Advocate ,
Feb 10, 2022 Feb 10, 2022

Copy link to clipboard

Copied

Not every workflow is straight forward like that though is it. This particular issue hasn't caused me personally an issue for years since we discovered this bug / feature,  and I work to ensure it doesn't cause me trouble, But many projects start out as a poster or flyer then you get a request for social media posts etc. illustrator is great for flexible working taking jobs and re-formatting layouts and exporting in many file formats but this thread wouldn't have started if the pixel export wasn't giving people results they weren't expecting. 

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines