title: Animate button background color in XAML
body: <p>I new to WPF and XAML, so I have <code>ResourceDictionary</code> (one button for now):</p>
  
  <pre><code>&lt;ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"&gt;
  
      &lt;Style x:Key="ButtonProduct" TargetType="Button"&gt;
          &lt;Setter Property="SnapsToDevicePixels" Value="true"/&gt;
          &lt;Setter Property="OverridesDefaultStyle" Value="true"/&gt;
          &lt;Setter Property="HorizontalAlignment" Value="Center"/&gt;
  
          &lt;Setter Property="Template"&gt;
              &lt;Setter.Value&gt;
                  &lt;ControlTemplate TargetType="{x:Type Button}"&gt;
                      &lt;Border Name="Border"  
                              CornerRadius="0" 
                              BorderThickness="0"
                              Focusable="False"
                              BorderBrush="Transparent" Background="White"&gt;
                          &lt;ContentPresenter Margin="2" HorizontalAlignment="Center" VerticalAlignment="Center" RecognizesAccessKey="True"/&gt;
                      &lt;/Border&gt;
                      &lt;ControlTemplate.Triggers&gt;
                          &lt;Trigger Property="IsMouseOver" Value="true"&gt;
                              &lt;Setter  Property="Background" Value="#52b0ca"/&gt;
                          &lt;/Trigger&gt;
                      &lt;/ControlTemplate.Triggers&gt;
                  &lt;/ControlTemplate&gt;
              &lt;/Setter.Value&gt;
          &lt;/Setter&gt;
      &lt;/Style&gt;
  &lt;/ResourceDictionary&gt;
  </code></pre>
  
  <p>On hover the color of the button changes, but how can I make change in fade in and out, for smooth transition of the color?</p>