Styling#

Ignis supports both CSS and SCSS.

Using CSS/SCSS file#

To get started, add the following to your config:

from ignis.app import IgnisApp

app = IgnisApp.get_default()

app.apply_css("PATH/TO/CSS_FILE")

For example, we will use ~/.config/ignis/style.scss:

import os
from ignis.app import IgnisApp

app = IgnisApp.get_default()

app.apply_css(os.path.expanduser("~/.config/ignis/style.scss"))

Now, you can add a CSS class to any widget and style it in the CSS file. To add CSS classes to a widget, use the css_classes property.

Widget.Label(
    label="hello",
    css_classes=["my-label"]
)

In style.scss:

.my-label {
    background-color: red;
}

Warning

The style property does not support SCSS features, only CSS.

Widget.Label(
    label="hello",
    style="background-color: black;"
)