--- title: "How to: Make a UIElement Transparent or Semi-Transparent" ms.date: "03/30/2017" helpviewer_keywords: - "UIElements [WPF], transparency" - "opacity [WPF], of UIElements" - "transparency of UIElements [WPF]" - "UIElements [WPF], opacity" ms.assetid: a49fc8d6-7b32-4f28-9122-39b632a19b4b --- # How to: Make a UIElement Transparent or Semi-Transparent This example shows how to make a transparent or semi-transparent. To make an element transparent or semi-transparent, you set its property. A value of `0.0` makes the element completely transparent, while a value of `1.0` makes the element completely opaque. A value of `0.5` makes the element 50% opaque, and so on. An element's is set to `1.0` by default. ## Example The following example sets the of a button to `0.25`, making it and its contents (in this case, the button's text) 25% opaque. [!code-xaml[brushsamples_snip#2](~/samples/snippets/csharp/VS_Snippets_Wpf/brushsamples_snip/CS/OpacityExample.xaml#2)] [!code-csharp[brushsamples_procedural_snip#2](~/samples/snippets/csharp/VS_Snippets_Wpf/brushsamples_procedural_snip/CSharp/OpacityExample.cs#2)] If an element's contents have their own settings, those values are multiplied against the containing elements . The following example sets a button's to `0.25`, and the of an control contained with in the button to `0.5`. As a result, the image appears 12.5% opaque: 0.25 * 0.5 = 0.125. [!code-xaml[brushsamples_snip#3](~/samples/snippets/csharp/VS_Snippets_Wpf/brushsamples_snip/CS/OpacityExample.xaml#3)] [!code-csharp[brushsamples_procedural_snip#3](~/samples/snippets/csharp/VS_Snippets_Wpf/brushsamples_procedural_snip/CSharp/OpacityExample.cs#3)] Another way to control the opacity of an element is to set the opacity of the that paints the element. This approach enables you to selectively alter the opacity of portions of an element, and provides performance benefits over using the element's property. The following example sets the of a used to paint the button's is set to `0.25`. As a result, the brush's background is 25% opaque, but its contents (the button's text) remain 100% opaque. [!code-xaml[brushsamples_snip#4](~/samples/snippets/csharp/VS_Snippets_Wpf/brushsamples_snip/CS/OpacityExample.xaml#4)] [!code-csharp[brushsamples_procedural_snip#4](~/samples/snippets/csharp/VS_Snippets_Wpf/brushsamples_procedural_snip/CSharp/OpacityExample.cs#4)] You may also control the opacity of individual colors within a brush. For more information about colors and brushes, see [Painting with Solid Colors and Gradients Overview](../graphics-multimedia/painting-with-solid-colors-and-gradients-overview.md). For an example showing how to animate an element's opacity, see [Animate the Opacity of an Element or Brush](../graphics-multimedia/how-to-animate-the-opacity-of-an-element-or-brush.md).