Text-opacity¶
The text-opacity
style blends the color of the content of a widget with the color of the background.
Syntax¶
text-opacity: <number> | <percentage>;
The text opacity can be set as a <number>
or a <percentage>
.
0
/0%
means no opacity, which is equivalent to full transparency.
Conversely, 1
/100%
means full opacity, which is equivalent to no transparency.
Values outside of these ranges will be clamped.
Example¶
This example shows, from top to bottom, increasing text-opacity
values.
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.css")
CSS¶
Python¶
# Set the text to be "half-faded" against the background of the widget
widget.styles.text_opacity = "50%"
See also¶
opacity
to specify the transparency of a whole widget.