Colour background of widget not rendering correctly

[ben-nour]

Hi there,

I've set the background colour of a widget to this hex code: #18375f

However, to my eye, the colour being rendered is different:

Here is the Python and CSS code:

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


class ColorApp(App):
    CSS_PATH = "colour.tcss"

    def compose(self):
        yield Label("The quick brown fox jumps over the lazy dog!", id="lbl1")


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

Label {
    color: auto 80%;
    content-align: center middle;
    height: 1fr;
    width: 100%;
}

#lbl1 {
    background: #18375f
}

Other colours I've tested are rendering correctly.

Thanks!

[davep]

The most likely reason is going to be down to your terminal/environment (you don't say anything about that so it's not possible to directly address that -- the request that textual diagnose be run and pasted into issues is to help with that sort of information).

But... here's 3 different terminals running your code:

you can see that two of them (kitty and wezterm, on macOS) look how you would expect, and one (terminal.app) is looking wrong (in this case that is addressed in the FAQ).

Perhaps you could give more information about the environment you're running your application in?

[ben-nour]

The most likely reason is going to be down to your terminal/environment (you don't say anything about that so it's not possible to directly address that -- the request that textual diagnose be run and pasted into issues is to help with that sort of information).

But... here's 3 different terminals running your code:

you can see that two of them (kitty and wezterm, on macOS) look how you would expect, and one (terminal.app) is looking wrong (in this case that is addressed in the FAQ.

Perhaps you could give more information about the environment you're running your application in?

Thanks so much, you're right, I'm using Terminal on a MacBook and that seems to be the issue!