-
Notifications
You must be signed in to change notification settings - Fork 29k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Icons appearing blurry and thicker #83316
Comments
Looking into this more, I realize that all of our icons are slightly off-grid, which makes them pixelated as well: Compared to how they are designed: I suspect this has something to do with our icon font generating tool we use for our icon font. |
My findings were about how some platforms/browsers render font glyphs and I was able to update these via #83951. However, it appears that the original issue with the activity bar appearing blurry is related to an issue where icons rendered on Windows appear bold. Below is a comparison of macOS (top) and Windows (bottom): Also, |
@deepak1556 would you know if this is related to an electron change (possibly #59887) that affects window font renderings? |
@deepak1556 wondering if this is related to the font rendering issue? #84154 |
Noticed this too. |
May be related to #84698 |
@misolori @Guema how does it look like with todays insider build? Make sure to update if you did not yet: https://code.visualstudio.com/insiders/ Version must be |
Oh I am sorry, there is a change missing on my end to get this right. Hold on... |
@bpasero That version looks much better to me (its no longer grayscale AA). Although just like the editor text, it is still much "smoother" than 1.39.2 was. |
@eamodio can you spot a difference in the area of the activity bar or just in general? |
Seems closer to the initial look, even if there it is still different when looking closer. (1.39.2 vs this insiders build vs Exploration) The gear icon is where it is the more visible. the 3 versions are different. Finally, here is a Windows-Zoomed version where we can see the differences well. It seems related to anti-aliasing method : The difference is visible to me only on :
Otherwise, I probably would not have seen the difference without zooming |
@Guema i am not sure about using the exploration build, that one lags behind a lot of changes we did and only comes with Electron 7. Best to compare current stable 1.40.1 with the version from the zip I posted. |
Yeah i could do that, but it seems that launching an instance of the same build type just launch an instance of the already launched editor (If i want to compare 1.39, 1.40 and insiders) I already tried to launch insiders production build and the one you shared, but only could launch one of them at the time |
@Guema you can solve this by providing (from the command line when putting the full path to the code EXE): |
@bpasero in general, but imo its most noticeable on the activity bar |
I see a difference still (left stable 1.39, right latest insiders): I am not sure what the cause is, possibly Chrome decides to render colors differently when transparency is applied or we changed something with our Codicons that could have an impact. @misolori I can get it to look almost the same as before if I use a stronger color (#AAAAAA) for the inactive foreground: Unfortunately this is probably platform dependent and also should account for the active color, not be hardcoded. Maybe you wanna play around with changing the activity bar colors if there is a solution that works on all platforms. We could throw in some platform checks in the theme.ts file as well if that is needed. /cc @deepak1556 if you know of any related Chrome issue that could have an impact |
Oh wait, there was a change in opacity in insiders from 0.6 to 0.4, that could explain it! |
@bpasero I still see a difference in your last screen shot -- the left one is thinner and less fuzzy. But yeah, with the transparency change they are indeed closer. |
I see the same |
Well to be fair, I think we have to live with the fact that browsers change and accept that. I do not think this is an issue on our end nor Electron we can change. |
imo the fix you done make it far more close to initial design. |
Removing milestone as this was handled by #84584 |
Comparing stable (left) vs insiders (right) it appears that the new activity bar icons that are using the icon font are thicker for some reason.
The text was updated successfully, but these errors were encountered: