Blurry UI - Even at 100% Scaling



  • Some elements in the user interface are not crisp. While the address bar is clean, the bookmark icon and tab contents are blurry and looks upscaled. Some text in websites also experience this. My UI Scaling is at 100%, and this is not a problem on other browsers I have used. I am running Vivaldi 1.0.403.20 on Windows 10 on a Surface Pro 3 with a resolution of 2160x1440 Attachments: [img]https://forum.vivaldi.net/uploads/attachments/75001/blurryandcrisp.PNG[/img]



  • Yes, Vivaldi has a big problem with fonts, in either gui or sites.

    Even on the last official post in blog: https://vivaldi.net/en-US/teamblog/90-vivaldi-getting-closer-to-1-0-beta-3-is-here-with-new-session-load-save-tab-zoom-and-a-lot-of-new-options

    None of pictures' font is crisp.

    I don't know why this issue appears to be totally ignored by Vivaldi developers. For me - it's very important.


  • Moderator

    It's not ignored. It's hard to reproduce, and possibly hard to fix as well.



  • Well, just opening Vivaldi gives us this issue ;) It's always present, as you can see in pictures on the blog.



  • Do you have any UI scaling enabled at the windows level?

    Right click/long press on your desktop and go to display settings, make sure the slider for "Change the size of text, apps and other items" is at 100%


  • Moderator

    @elektronicznypank:

    Well, just opening Vivaldi gives us this issue ;) It's always present, as you can see in pictures on the blog.

    The issue is not present on any of my four towers, or my three laptops.





  • These are official Vivaldi screenshots so laptop of the person who inserted them on the blog should have a computer capable of reproduce this issue.

    I made Vivaldi screenshot with dark interface. Fonts on adress, tabs and all abowe are unclear and jagged.



    Also fonts on the page in bottom are worse antialiased.

    The same page on Firefox:



    Thumbs up for Vivaldi development, because I really like this browser :)



  • Yeah I'm sure it has to do with the way Chromium scales the UI elements. Firefox has been much better at providing a scaled, crisp UI automatically for a long while now. I don't know what is taking the Chromium team so long to catch up, especially in this age of 4K monitors.

    Thankfully the Vivaldi team has provided a way to scale the UI up because on Chromium there is no way and it becomes so small on a larger screen, it's unpleasant to use.



  • I do wish people would separate jagged from blurry - they are opposites.

    I know from the Opera forums that blurry is usually related to hardware acceleration and Cleartype (on Windows), you might see what that does on Vivaldi.



  • @NTripleOne:

    Do you have any UI scaling enabled at the windows level?

    Right click/long press on your desktop and go to display settings, make sure the slider for "Change the size of text, apps and other items" is at 100%

    My system scaling settings are the same as what they have been for a year. I'm using the default 150% for my Surface and haven't seen this problem with any other browser. Firefox's UI is still crisp for example.



  • Sure it's not your screen which isn't set at native screen resolution?
    If you set your computer screen at different than real screen resolution, it won't always look good.

    If your monitor got a real resolution of 1920x1080, and it is set at 1680x1050, it might be a bit blurry.



  • @HaaEnn:

    Sure it's not your screen which isn't set at native screen resolution?

    This is definitely a Vivaldi/chrome issue. I have a 4k display at native resolution and 140% scaling Chropera as well as Firefox scale their UI and web page rending crisp, while Vivaldi is blurry. In addition the kerning is broken for scaled rendering, it looks as if the letter are laid out for 100% scale, aligned to full pixels, then multiplied by 1.4 + additional rounding errors.

    My current workaround for crisp rendering and working kerning is:

    [ol]

    • pass –force-device-scale-factor=1 to vivaldi.exe
    • set interface zoom to 140%
    • set default web page zoom to 140%
      [/ol]

    This way Vivaldi looks and works mostly okay for > 100% scaling (apart from a few issues like per tab zoom causing related tabs to default to 100% instead of default zoom/parent tab zoom).



  • Try to disable DirectWrite

    vivaldi://flags -> DirectWrite (2nd Position) -> Disable



  • @Brainc0re:

    Try to disable DirectWrite

    vivaldi://flags -> DirectWrite (2nd Position) -> Disable

    Just tried again; doesn't do anything, UI still blurry and kerning still wrong after enabling the flag. I already tried to enable/disable everything that sounded related to rendering, and nothing did a noticeable difference.


Log in to reply
 

Looks like your connection to Vivaldi Forum was lost, please wait while we try to reconnect.