How to apply simple faded transparent effects on WPF controls ?

Using OpacityMask property we can make a specific region of an element transparent or partially transparent . In this tips I am going to show you how you can apply faded transparent effects on some elements in WPF.

We can use OpacityMask with both SolidColorBrush or GradientColorBrush . But if you want achieve the transparent effects with faded view, you have to use OpacityMask with LinearGradientBrush or even you can use RadialGradientBrush.

Let’s start with a GradientColorBrush where I have applied a gradient effects that moves from a solid to transparent color which applies to TextBox Control.


So, above code block sets the TextBox control OpacityMask with a LinerGradientBrush where gradient start from Black to Transparent.

Similarly you can apply with others elements as well, let’s say for a  Button control  as shown in below


On run, we will get the below output.


Well, now you can try with RadialGradientBrush for more fun

Below the complete XAML Code Block

<Window x:Class="WpfApplication3.MainWindow"
        Title="MainWindow" Height="350" Width="525" Background="AliceBlue">
        <Image Name="image1" Stretch="Fill"  Margin="12" Source="/WpfApplication3;component/Images/Backgrounds_25962.jpg" />    
            Content="Click Me !" 
            Width="234" >
                <LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
                    <GradientStop Offset="0.3" Color="Black"></GradientStop>
                    <GradientStop Offset="1" Color="Transparent"></GradientStop>
        <TextBox Height="30" Margin="83,74,59,207">
                <LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
                    <GradientStop Offset="0" Color="Black"></GradientStop>
                    <GradientStop Offset="1" Color="Transparent"></GradientStop>

Hope this will help.

Cheers !


Subscribe To Newsletter For your Daily Development Tips and Tricks  

 Best Tips & Tricks on Microsoft Technology Platform 

Invalid email address
We promise not to spam you. You can unsubscribe at any time.
Abhijit Jana

Abhijit runs the Daily .NET Tips. He started this site with a vision to have a single knowledge base of .NET tips and tricks and share post that can quickly help any developers . He is a Former Microsoft ASP.NET MVP, CodeProject MVP, Mentor, Speaker, Author, Technology Evangelist and presently working as a .NET Consultant. He blogs at , you can follow him @AbhijitJana . He is the author of book Kinect for Windows SDK Programming Guide.