Important: Please read the Qt Code of Conduct -

How to control the font size in QWebEngineView?

  • Hello,

    I would like to let the user increase/decrease the font size in the text displayed by QWebEngineView. What is the best way to do it?

    I tried

    QFont f = browser->font(); // browser is a pointer to a QWebEngineView widget
    int p = f.pointSize();
    f.setPointSize(p * 2);     // double the font size

    and it had no effect.

    Besides, the application uses system default fonts, and this approach may require checking of pointSize(), pixelSize(), and pointSizeF().

    Thank you in advance,


  • @roni219 The "font" you have accessed there is the font for the widget (inheritance is QObject->QWidget->QWebEngineView). The fonts rendered in the web page are those for the HTML within not the widget.

    Try using QWebEngineView::setZoomFactor(2.0) to double the size. I suspect this will scale images too. I'm not sure that scaling of images and text is separable.

  • Thank you very much, @matthew-kuiash ! The method worked. Indeed, as you predicted, it zooms the images as well, but for the interactive zoom feature it is the right behaviour.

    I will not mark the topic "solved" for a few more days, in case somebody suggests the font control as well. The default fonts on Linux and Windows 10 are very different. The Windows font is very small, it would be nice to set the default to larger font.

  • You can fixe a minimum font size:

    QWebEngineSettings *defaultSettings = QWebEngineSettings::globalSettings();

    For the default font, you can set any font size you like as well:

    QFontDatabase fontDataBase;
    QWebEngineSettings *defaultSettings = QWebEngineSettings::globalSettings();
    QFont standardFont=fontDataBase.font("Arial","",12);

    [edit] i'm suspicious about the second solution i provide, as it's set the font familly not the size i guess ...

  • Thank you very much, @mpergand! The "minimum font size" method worked!

    I tried it the way you suggested, and also with QWebEngineView::settings(). Either way it worked.

    Curiously, the same font size settings produce different results across the platforms. I checked my initial QWebEngineView font sizes, and they were the same on Ubuntu 14.04 and on Windows 10:

    MinimumFontSize = 0
    MinimumLogicalFontSize = 6
    DefaultFontSize = 16
    DefaultFixedFontSize = 13

    Yet the text is visibly smaller on Windows. Both screenshots below are taken after MinimumFontSize is set to 16:

    alt text
    alt text
    Perhaps the minimum size must be larger for Windows version of the application.

  • Your screenshots doesn't show.

    Unfortunatly, depending the font family the display size could be different even if the font size is the same.

  • I think is normal.

    What you can do, is to register the zoomFactor that the user set in the QSettings of your app.
    When you open a webView, you set back the zoomFactor value from the QSettings.

  • Thank you, @mpergand , QSettings is a very good idea, I will do as you suggested.

Log in to reply