text-opacity style blends the foreground color (i.e. text) with the background color.
The text opacity of a widget can be set as a
<number> or a
If given as a number, then
text-opacity should be a value between 0 and 1, where 0 makes the foreground color match the background (effectively making text invisible) and 1 will display text as normal.
If given as a percentage, 0% will result in invisible text, and 100% will display fully opaque text.
Typically, if you set this value it would be somewhere between the two extremes.
For instance, setting
70% would result in slightly faded text. Setting it to
0.3 would result in very dim text.
Be careful not to set text opacity so low as to make it hard to read.
This example shows, from top to bottom, increasing
from textual.app import App from textual.widgets import Label class TextOpacityApp(App): def compose(self): yield Label("text-opacity: 0%", id="zero-opacity") yield Label("text-opacity: 25%", id="quarter-opacity") yield Label("text-opacity: 50%", id="half-opacity") yield Label("text-opacity: 75%", id="three-quarter-opacity") yield Label("text-opacity: 100%", id="full-opacity") app = TextOpacityApp(css_path="text_opacity.tcss")
opacityto specify the opacity of a whole widget.