Font sizes within gtk3 programs

advice1010 · 2023-09-17 22:22:13

I saw mentioned on this forum that you can add a line of code to the gtk3 css file that allows user to specifiy font size used by a specific program.
In the example, Thunar was used. I have been using this trick for a while now but I have some other questions about what is possible as far as font sizes in Xfce.

1.) Is it possible to add some kind of option to a programs launch command that would allow the same effect as this gtk3 css file trick?
So that say for example you want to have two diifferent instances of Thunar, that each load with a different font size.

(I thought I actually read something about this on this forum in the past, but this would be a good place to ask.)
2.) The trick mentioned allows user to change all the font sizes using one number value, which applies to every font in the program. Is there a way in Xfce to get even more specific with a specific programs font size?
Meaning can you add other code items to the gtk3 css file to change specific fonts within a program, such as fonts for Menu Bar, Tabs, Status Bar, etc.?

Thank You

Last edited by advice1010 (2023-12-27 00:01:08)

ToZ · 2023-09-18 23:50:23

advice1010 wrote:

1.) Is it possible to add some kind of option to a programs launch command that would allow the same effect as this gtk3 css file trick?
So that say for example you want to have two diifferent instances of Thunar, that each load with a different font size.

Not easily. If you have the thunar daemon running, it will always re-use the theme that was active when the daemon restarted. With some apps you can force a different GTK theme at app startup using the "GTK_THEME" variable, for example:

GTK_THEME=Greybird mousepad

...and it will force Greybird to use another theme. However, separate gtk.css files are supported so you would need to create custom themes and use them.

(I thought I actually read something about this on this forum in the past, but this would be a good place to ask.)
2.) The trick mentioned allows user to change all the font sizes using one number value, which applies to every font in the program. Is there a way in Xfce to get even more specific with a specific programs font size?
Meaning can you add other code items to the gtk3 css file to change specific fonts within a program, such as fonts for Menu Bar, Tabs, Status Bar, etc.?

For GTK prorgams, probably yes. If you can give an example of a program and the fonts to change, I can examples of CSS tweaks to adust those fonts.

John Jason Jordan · 2023-09-27 08:33:59

Lately I have been having a terrible time with tiny, unreadable fonts in about a quarter of the programs I have installed in SparkyLinux. It is based on Debian Stable and has an unusual way of handling desktop environments; there is just one ISO, but the first time it boots you are presented with your choice of ten or so different desktop environments. I selected Xfce, and haven't looked back.

The problem is that I have a 4K (3840x2160) monitor, and in a lot of programs the fonts are so tiny that the program is unusable. One such program is Jubler, a subtitle editor that is currently distributed via appimage. I queried the devs about the problem and received a reply:

'XFCE4 unfortunately is not HiDPI aware. I myself am using two HiDPI monitors, both of them in 4K resolution. Indeed on an environment not compatible with HiDPI the letters are impossible to read.'

I've been using Xfce for years, but I've never heard this before. Is it correct that my problem lies within Xfce? Is there a solution?

Last edited by John Jason Jordan (2023-09-27 08:34:41)

ToZ · 2023-09-27 11:08:57

It really depends on the program that is causing the issue. Jubler is a java program.

Xfce does support scaling - you need to go to Settings Manager > Display and adjust the scale box (the lower the number the larger the size of the elements). This will affect all elements on the screen (especially useful for HiDPi screens).

Also, java programs now support the GDK_SCALE variable, so you could start Jubler with something like:

GDK_SCALE=1.5 Jubler...

...to get just its elements to size up.

Here is some more info on options to resize java applications.

advice1010 · 2023-10-19 21:23:02

@ToZ
I am sorry I missed your response (#2 above)
2.) Okay how about Thunar? Changing specific fonts such as
-Menu bar
-Tabs
-Status bar

I don't think you can get as specific as
-File Pane
-Folder Tree Sidebar
-Bookmark Places Sidebar
although these all fonts change when you use the global font size trick with Thunar in the css file so maybe?

Once I see the general idea from your examples, I assume / will try to apply them to other programs and see if they work for them as well.

Thanks again

ToZ · 2023-10-19 22:08:58

advice1010 wrote:

-Menu bar

.thunar menubar menuitem label {font-size: 16pt}

-Tabs

.thunar .reorderable-page label {font-size: 24pt}

-Status bar

.thunar statusbar box label {font-size: 6pt}

-File Pane

.thunar .standard-view .view {font-size: 24pt}

-Folder Tree Sidebar
-Bookmark Places Sidebar

.thunar .sidebar .view {font-size: 32pt}

advice1010 · 2023-10-23 21:21:33

@ToZ
Thank you so much for your response.
Wow, I didn't think that XFCE would be able to get this specific with font sizes, this is great information. Now you got me thinking... how specific can we go....
Do you by any chance know if there is one for
-Thunar - Address Bar (Location Bar)
-Thunar - Context Menu (RMB click)
I think these two above would cover pretty much every available font in a program.

This I would imagine not possible but worth asking.
I noticed that the one for the file pane font size also applies to the column headers (if using "Detail" view)
I get why it does but don't personally like this, do you know there are any to split these two items and apply font size separately?
-File pane font
-File pane column header labels ("Details" view)

I didn't get to test much more than applying this to Thunar, I still have to see how these apply with other 3rd party programs. I did however try something that made me ask another question.

Might be a little tricky, but do you know if there is coding that can allow this to be applied to Appimages?
I tried for example the following two guesses but neither worked.

.~/Downloads/<appimagename>.appimage menubar menuitem label {font-size: 16pt}

.$HOME/Downloads/<appimagename>.appimage menubar menuitem label {font-size: 16pt}

Global XFCE font setting applies to Appimages so it is possible, but not sure if possible in this context of specific programs.

I have said similar things before, but you provide such quality answers, not just for me but for everyone in this community, very helpful, thank you again.

Last edited by advice1010 (2023-10-23 21:26:57)

advice1010 · 2023-10-23 21:41:06

I was also going to make a separate post about the ability to change icon sizes for specific programs as well, but I have seen you mention that this is no longer supported in gtk3 which is strange. I have seen you mention that a "scale" can be used but have not tried it yet.

Main icons I can think of within a program would be for example using Thunar....
Thunar - Toolbar Icon Sizes
Thunar - Menu Bar Icon Sizes
Thunar - Context Menu Icon Sizes

Last edited by advice1010 (2023-10-23 21:42:01)

ToZ · 2023-10-23 23:53:32

advice1010 wrote:

-Thunar - Address Bar (Location Bar)

.thunar toolbar entry {font-size: 64pt}

-Thunar - Context Menu (RMB click)

I don't believe its possible to affect this only at the thunar level - its a gtk3-wide setting.

This I would imagine not possible but worth asking.
I noticed that the one for the file pane font size also applies to the column headers (if using "Detail" view)
I get why it does but don't personally like this, do you know there are any to split these two items and apply font size separately?
-File pane font
-File pane column header labels ("Details" view)

You can further set the header label font via:

.thunar .standard-view .view label {font-size: 12pt}

Might be a little tricky, but do you know if there is coding that can allow this to be applied to Appimages?

Unfortunately I don't have any experience with appimages. It would depend on whether they are GTK3 and what styles they have available. Try running the appimage like this:

GTK_DEBUG=interactive appimage

...to see what comes up.

I'll see if I can install an appimage to have a closer look.

ToZ · 2023-10-24 00:00:23

advice1010 wrote:

I was also going to make a separate post about the ability to change icon sizes for specific programs as well, but I have seen you mention that this is no longer supported in gtk3 which is strange. I have seen you mention that a "scale" can be used but have not tried it yet.

It is possible using the "-gtk-icon-transform" function.

Thunar - Toolbar Icon Sizes

To do all of them:

.thunar toolbar toolbutton image {-gtk-icon-transform: scale(0.5);}

To get individual icons:

.thunar toolbar toolbutton:nth-child(1) image {-gtk-icon-transform: scale(0.5);}

...where nth-child is the icon in order as it appears.

Thunar - Menu Bar Icon Sizes

.thunar menubar menuitem image {-gtk-icon-transform: scale(0.5);}

Thunar - Context Menu Icon Sizes

These don't seem to work unfortunately for the same reason, I believe, as the previous comment. For example, if you:

menu image {-gtk-icon-transform: scale(0.5);}

...it will scale it but for all GTK3 apps.

advice1010 · 2023-10-24 22:21:53

@ToZ
Man, thank you so much for all of this.
Give a little time and I will try this stuff out.
Wow didn't think the headers would be possible.

Context Menus
Okay so the context menus cannot be done specifically.
So they can be done on a global level which applies to all context menus?
I might want to mess around with this, do you know where this setting is?
Is it a line of code that goes in the same gtk.css file but just applies to DE / all programs?
I have only been able to change their size with the XFCE global font setting which as mentioned applies to everything.
I can look this up more, I just figured I would ask because you mentioned it.

Appimages
Just to point out the appimage that I did my testing on was a gtk2 based application.
I figured that might be an issue, there isn't a gtk.css file in the gtk2.0 folder like there is with the gtk3.0 folder.
I just figured I would try because as mentioned that application does seem to response to global font settings / icons.
I will test some other gtk3 based appimages as well to see if maybe I see what is possible.

Thank you again for all your help, looks like some great stuff to test out.

Last edited by advice1010 (2023-10-24 22:23:28)

advice1010 · 2023-12-26 23:57:15

@ToZ
Thank you again for all this great information, still would have never thought all this would have been possible. I have a couple more questions if you have some time / know the answers.

DIALOG BOXES
Was just thinking, what about dialog boxes, using Thunar still as the example.
-Like the F2 renaming dialog box / new folder dialog box?
Dialog box font
Dialog box input field font

-Warning / Error dialog box fonts?

SEARCH / FIND FIELDS
Again can use Thunar as an example.
Do you know if search / find fields fonts have a their own setting?

GLOBAL SETTINGS
Is there a global setting for specific items fonts for all applications.
For example make all programs “Menu Bar” font a specific size.
You gave this as an example for Thunar, is a there a global kind of tag? in place of ".thunar"
.thunar menubar menuitem label {font-size: 16pt}

GLOBAL SETTINGS - CONTEXT MENUS
Also, above I asked about being able to change “context menu" fonts that show up with RMB click and you mentioned

I don't believe its possible to affect this only at the thunar level - its a gtk3-wide setting.

Do you know if there is a specific setting that I could use to change just the font size of the context menu for all applications? Or is this just only linked to the Appearance - Fonts global setting only?

Thank you again for all the help you have provided me, very appreciated.

Last edited by advice1010 (2023-12-26 23:58:22)

eriefisher · 2023-12-27 00:12:22

GTK3 uses CSS. GTK2.0 does not. You can still manipulate gtk2.0 but the syntax is very different. Unfortunately I don't have any examples for you but it's been around for a very long time and should be easy to find.

ToZ · 2023-12-27 02:11:32

advice1010 wrote:

DIALOG BOXES
Was just thinking, what about dialog boxes, using Thunar still as the example.
-Like the F2 renaming dialog box / new folder dialog box?
Dialog box font
Dialog box input field font
-Warning / Error dialog box fonts?

There is no thunar-specific dialog box classes or ids. It uses ".dialog-vbox" style class. So you could affect all of these dialogs system-wide via:

.dialog-vbox label:nth-child(1) { font-size: 32} /* action buttons */
.dialog-vbox label:nth-child(2) { font-size: 48} /* text */
.dialog-vbox entry { font-size: 64 } /* entry field */

SEARCH / FIND FIELDS
Again can use Thunar as an example.
Do you know if search / find fields fonts have a their own setting?

.thunar toolbar toolitem entry {font-size: 128pt}

GLOBAL SETTINGS
Is there a global setting for specific items fonts for all applications.
For example make all programs “Menu Bar” font a specific size.
You gave this as an example for Thunar, is a there a global kind of tag? in place of ".thunar"
.thunar menubar menuitem label {font-size: 16pt}

Just remove ".thunar" and it should apply to all GTK3 menubar items.

GLOBAL SETTINGS - CONTEXT MENUS
Also, above I asked about being able to change “context menu" fonts that show up with RMB click and you mentioned
I don't believe its possible to affect this only at the thunar level - its a gtk3-wide setting.
Do you know if there is a specific setting that I could use to change just the font size of the context menu for all applications? Or is this just only linked to the Appearance - Fonts global setting only?

menu label {font-size: 64pt}

advice1010 · 2024-01-11 21:50:41

@ToZ
Again thank you so much for all this help, great information.
The global
Might want to change right above this, don't think this one works "menu label {font-size: 64pt}"
This works "menubar menuitem label {font-size: 24pt}"

Ahh I don't like when items fonts are linked globally to all programs, such as the dialogs font you mentioned, that is unfortunate, but still great information that I will use, if you ever find there is a way to override this please let me know.

Reason I say this is you also mentioned this above when I asked about context menus, that they apply globally in gtk3.
Here is something interesting though, as I mentioned in my other post about looking how to achieve this also in gtk2/qt based applications. This can also be achieved in gtk2 when using environmental variables and in these you can set the menu bar font, but the menu bars drops downs use a different variable. This variable in gtk2 not only applies to the menu bars drop downs, but also actually applies to context menus. So in gtk2 you can set the font size of context menus for specific program, only thing is, again it is linked to menu bar drop down, but can make sense because they are similar menus.
So, strange this could be achieved in gtk2 but the abiltity to do this in gtk3 was removed?

As mentioned though, I really like how gtk2 / gtk3 has the ability to achieve this, qt does not seem to be able to achieve this.

Anyways, just thought I would share this.

Thank you again for all your help

Last edited by advice1010 (2024-01-11 21:52:24)

advice1010 · 2024-01-11 21:56:17

While I am sharing some things I have noticed, here is another one.

If you use a global setting for a specific items font size such as menu bar

menubar menuitem label {font-size: 24pt}

If you use a global font setting to apply to all fonts in a specific program such as

.thunar { font-size: 12pt }

This setting will not override the global menu bar font size 24 from example above,
which I would think that it would

but if you do this, it DOES override the global menu bar font

.thunar menubar menuitem label {font-size: 12pt}

Don't think anyone would care about this but could be good to know.

Thank You

Last edited by advice1010 (2024-01-11 22:01:07)

advice1010 · 2024-01-14 21:07:40

On top of what I mentioned above, I also noticed that I can only seem to get the gtk.css file to work with Thunar. When I try any of these examples above that use Thunar as the example, no other gtk3 based applications seem to work with them?
If I launch different application from terminal it shows something similar to the following error

Gtk-WARNING   Theme parsing error: gtk.css:11:13: Expected a valid selector

The programs load, but no font sizes are applied per specific item.

I have tried this in past and always thought that I was just using gtk2 or qt based applications and that was why it does not work but I tried specific gtk3 based applications and non work.

If anyone has any ideas why this wouldn't be working, please let me know.

Thank You

Last edited by advice1010 (2024-01-14 21:08:37)

ToZ · 2024-01-14 21:16:44

advice1010 wrote:

Gtk-WARNING   Theme parsing error: gtk.css:11:13: Expected a valid selector

What is line 11 of your gtk.css file?

The programs load, but no font sizes are applied per specific item.

What other programs? Are you sure they are gtk3 programs? You can see if they are built against gtk3 by:

ldd $(which APPNAME) | grep gtk-3

...where APPNAME is the executable name.

advice1010 · 2024-01-17 19:30:45

@ToZ
Thank you for your response.
I deleted all my tests lines from my gtk.css file from the following location
$HOME/.config/gtk-3.0/gtk.css

I have tried quite a few gtk3 based programs.
I am not seeing the warning error any longer when I launch them from the terminal, but font sizes are still not changing.
The error might have been from a line where I was trying LibreOffice Calc.
Here are some of the other programs I have tried
Geany
Cherry Tree
Atril PDF Viewer
Firefox
LibreOffice Calc

.thunar { font-size: 18pt }

.cherrytree menuitem label { font-size: 18pt }

.geany { font-size: 18pt }

.atril { font-size: 18pt }

Thunar is the only one that appears to be updating, after I close the application in task monitor.
None of the other programs mentioned are running in task monitor.
I think I have also had these set when rebooting as well and no changes after that either.

I ran the command you provided on some of these to check them and they are showing gtk3.

Last edited by advice1010 (2024-01-17 19:38:22)

ToZ · 2024-01-17 20:02:12

Unfortunately, you can't just use the name of the application as the style class - it really depends on what the application developers set. The thunar developers set it to ".thunar".

For example, for atril it is ".atril-window". For geany, it would be "#GeanyMainWindow".

However, I can't help but think that setting the font size individually for each application isn't really the way to go here. Its too cumbersome. Why not just set a custom DPI at Settings Manager > Appearance > Fonts if you want to change the size of the fonts system-wide?

advice1010 · 2024-01-17 20:35:08

@ToZ
Ohh okay that is what it was, I would not have guessed that.
I picked a bad example to ask with Thunar because as you mentioned it uses ".thunar" which made me think that all applications were just based on launch command name.
How did you actually find what these programs use?
Especially Geany, odd (to me) that this uses a # instead of a "."
I just tried for example to search for "geany style class" just to see if I would be able to find anything.
Do you know if these are called something more specific so I could be able to find what each program uses?

Oh yeah and I agree, thank you for your concern, I don't plan on changing the font of each program like this, I was just using this as an example to show things I was trying just to get any program to work, which was before what you just shared about the style classes not being the same as program names.

Thank You

EDIT:
That just made me think of something, don't know now because I deleted it but I think when trying out LibreOffice Calc which was definitely wrong itself, but on top of that I also randomly just tried to use # to comment out that line, which was even more wrong
because this symbol could actually be used in style classes.
Commenting out in css uses /* */
All of this could be the reason for that gtk warning error I mentioned

Last edited by advice1010 (2024-01-17 20:43:35)

ToZ · 2024-01-17 22:18:15

advice1010 wrote:

@ToZ
Ohh okay that is what it was, I would not have guessed that.
I picked a bad example to ask with Thunar because as you mentioned it uses ".thunar" which made me think that all applications were just based on launch command name.
How did you actually find what these programs use?

I use the GTK Inspector. Start the program like this:

GTK_DEBUG=interactive atril

...and 2 windows will pop up. One is atril and the other is the inspector. More info on using the inspector at that link. Also have a quick look at this post as I do a brief walk through on how to use it.

Especially Geany, odd (to me) that this uses a # instead of a "."

Names starting with "." reference a style class. Names starting with a "#" reference a widget ID. Both can be used and both are used interchangeably I notice. The third name that can be used is the Gtk3 widget name, like "label", "scrollbar", "button", "image", but these tend to refer to actual elements.

I just tried for example to search for "geany style class" just to see if I would be able to find anything.
Do you know if these are called something more specific so I could be able to find what each program uses?

Starting geany as:

GTK_DEBUG=interactive geany

...you will see an inspector window like this:

You can further expand and drill down to see the style classes, widget IDs (Name), and actual widgets (Object), along with their hierarchical layouts.

EDIT:
That just made me think of something, don't know now because I deleted it but I think when trying out LibreOffice Calc which was definitely wrong itself, but on top of that I also randomly just tried to use # to comment out that line, which was even more wrong
because this symbol could actually be used in style classes.
Commenting out in css uses /* */
All of this could be the reason for that gtk warning error I mentioned

Correct.

Xfce Forum

Sub domains

#1 2023-09-17 22:22:13

Font sizes within gtk3 programs

#2 2023-09-18 23:50:23

Re: Font sizes within gtk3 programs

#3 2023-09-27 08:33:59

Re: Font sizes within gtk3 programs

#4 2023-09-27 11:08:57

Re: Font sizes within gtk3 programs

#5 2023-10-19 21:23:02

Re: Font sizes within gtk3 programs

#6 2023-10-19 22:08:58

Re: Font sizes within gtk3 programs

#7 2023-10-23 21:21:33

Re: Font sizes within gtk3 programs

#8 2023-10-23 21:41:06

Re: Font sizes within gtk3 programs

#9 2023-10-23 23:53:32

Re: Font sizes within gtk3 programs

#10 2023-10-24 00:00:23

Re: Font sizes within gtk3 programs

#11 2023-10-24 22:21:53

Re: Font sizes within gtk3 programs

#12 2023-12-26 23:57:15

Re: Font sizes within gtk3 programs

#13 2023-12-27 00:12:22

Re: Font sizes within gtk3 programs

#14 2023-12-27 02:11:32

Re: Font sizes within gtk3 programs

#15 2024-01-11 21:50:41

Re: Font sizes within gtk3 programs

#16 2024-01-11 21:56:17

Re: Font sizes within gtk3 programs

#17 2024-01-14 21:07:40

Re: Font sizes within gtk3 programs

#18 2024-01-14 21:16:44

Re: Font sizes within gtk3 programs

#19 2024-01-17 19:30:45

Re: Font sizes within gtk3 programs

#20 2024-01-17 20:02:12

Re: Font sizes within gtk3 programs

#21 2024-01-17 20:35:08

Re: Font sizes within gtk3 programs

#22 2024-01-17 22:18:15

Re: Font sizes within gtk3 programs

Board footer