Text-style¶

The text-style style sets the style for the text in a widget.

Syntax¶

text-style will take all the values specified and will apply that styling combination to the text in the widget.

Examples¶

Basic usage¶

Each of the three text panels has a different text style, respectively bold, italic, and reverse, from left to right.

Outputtext_style.pytext_style.tcss

from textual.app import App
from textual.widgets import Label

TEXT = """I must not fear.
Fear is the mind-killer.
Fear is the little-death that brings total obliteration.
I will face my fear.
I will permit it to pass over me and through me.
And when it has gone past, I will turn the inner eye to see its path.
Where the fear has gone there will be nothing. Only I will remain."""


class TextStyleApp(App):
    CSS_PATH = "text_style.tcss"

    def compose(self):
        yield Label(TEXT, id="lbl1")
        yield Label(TEXT, id="lbl2")
        yield Label(TEXT, id="lbl3")


if __name__ == "__main__":
    app = TextStyleApp()
    app.run()

Screen {
    layout: horizontal;
}
Label {
    width: 1fr;
}
#lbl1 {
    background: red 30%;
    text-style: bold;
}
#lbl2 {
    background: green 30%;
    text-style: italic;
}
#lbl3 {
    background: blue 30%;
    text-style: reverse;
}

All text styles¶

The next example shows all different text styles on their own, as well as some combinations of styles in a single widget.

Outputtext_style_all.pytext_style_all.tcss

from textual.app import App
from textual.containers import Grid
from textual.widgets import Label

TEXT = """I must not fear.
Fear is the mind-killer.
Fear is the little-death that brings total obliteration.
I will face my fear.
I will permit it to pass over me and through me.
And when it has gone past, I will turn the inner eye to see its path.
Where the fear has gone there will be nothing. Only I will remain."""


class AllTextStyleApp(App):
    CSS_PATH = "text_style_all.tcss"

    def compose(self):
        yield Grid(
            Label("none\n" + TEXT, id="lbl1"),
            Label("bold\n" + TEXT, id="lbl2"),