I'm pretty sure we use Ikonli-icons not just in the preferences dialog. So i guess it would be better, to put that into the base.css?

Btw, keeping the checkboxes in the PR description and checking them, if applicable, is mandatory!

Why did you open a new PR instead of pushing your commit onto the old branch?

@calixtus I've tried put it in base.css, but it also changes something else, which makes it weird.

I think it should look like the following pic.

So I just add it on perferencesDialog

You only need to add it to Dark.css so that it only is applied when you select the Dark theme

@Siedlerchr I know, but in the figures following:
AFTER

BEFORE

In this dialog, these icons' color will change, so I think put this code in PreferencesDialog.css would be better.

try the following

to .glyph icon add -fx-icon-color: -jr-theme-text;
and before add the ikonli font icon

.ikonli-font-icon {
	-fx-icon-color: red;
}
.glyph-icon {
    /* This adjusts text alignment within the bounds of text nodes so that
       the text is always vertically centered within the bounds. Based on
       the cap height of the text. */
    -fx-bounds-type: logical_vertical_center;

    /* The base color of icons should always be the same as the text. */
    -fx-fill: -fx-text-base-color;
    -fx-icon-color: -jr-theme-text;
}

@Siedlerchr In this way, it works but still have problems. In the figure, you can see this icon is colored by the theme-color while it should be the text base color.

If you look into IconTheme, you see that there is a method asButton which adds another css class and makes it an icon-button. Seems like you need to add an extra rule for that