Foreground Property

Gets or sets the Brush to apply to the content in this element.

XAML Values

Property Value

Brush

The brush used to apply to the text contents.

This property is read/write. The default value is Black.

Remarks

The Foreground property specifies a Brush for the rendered text. A Brush can represent a solid color, a linear or radial gradient, or an image.

Some brush types (SolidColorBrush) support a XAML attribute syntax, whereas other brush types (ImageBrush, LinearGradientBrush, RadialGradientBrush) only support an object element syntax. This is why two versions of XAML syntax are shown for this property.

When animating a Foreground, you must use indirect targeting. For instance, if you are animating the color of a SolidColorBrush that is the Foreground of a TextBlock, the syntax would be <ColorAnimation ... Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" />.

LineBreak is listed in the Applies To list for this property, because it does exist in the object model and you can get and set it. However, all LineBreak properties are ignored for rendering purposes.

Examples

The following XAML example shows how to set the Foreground property to a solid color and a linear gradient. Notice that the Foreground property can also be used in a Run in order to display a different color than Foreground property value of the TextBlock.

<!-- TextBlock with a single brush applied to the text. -->
<TextBlock
  FontSize="32"
  FontWeight="Bold"
  Foreground="Maroon">
  Maroon
</TextBlock>
<!-- TextBlock with three brushes applied to the text. -->
<TextBlock
  Canvas.Top="60"
  FontFamily="Arial"
  FontSize="32"
  FontWeight="Bold"
  Foreground="Navy">
  Navy
  <Run Text="DodgerBlue " Foreground="DodgerBlue"/>
  <Run Text="LightSteelBlue " Foreground="LightSteelBlue"/>
</TextBlock>
<!-- TextBlock with a linear gradient brush applied to the text. -->
<TextBlock
  Canvas.Top="100"
  FontFamily="Verdana"
  FontSize="32"
  FontWeight="Bold">
  LINEAR GRADIENT BRUSH
  <TextBlock.Foreground>
    <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
      <GradientStop Color="Red" Offset="0.0" />
      <GradientStop Color="Orange" Offset="0.2" />
      <GradientStop Color="Yellow" Offset="0.4" />
      <GradientStop Color="Green" Offset="0.6" />
      <GradientStop Color="Blue" Offset="0.8" />
      <GradientStop Color="Violet" Offset="1.0" />
    </LinearGradientBrush>
  </TextBlock.Foreground>
  <TextBlock.RenderTransform>
    <ScaleTransform ScaleY="3.0" />
  </TextBlock.RenderTransform>
</TextBlock>

The following illustration shows the rendered text from the previous XAML example.

TextBlocks rendering solid color and linear gradient brushes

Applies To

LineBreak, Run, TextBlock

See Also

Text and Fonts Overview
FontFamily
FontSize
FontStretch
FontStyle
FontWeight