Artemis/src/Artemis.UI/Screens/Module/ProfileEditor/Visualization/ProfileLayerView.xaml

<UserControl x:Class="Artemis.UI.Screens.Module.ProfileEditor.Visualization.ProfileLayerView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:local="clr-namespace:Artemis.UI.Screens.Module.ProfileEditor.Visualization"
             xmlns:s="https://github.com/canton7/Stylet"
             mc:Ignorable="d"
             d:DesignHeight="450"
             d:DesignWidth="800"
             d:DataContext="{d:DesignInstance {x:Type local:ProfileLayerViewModel}}">
    <UserControl.Resources>
        <Style TargetType="{x:Type Canvas}" x:Key="SelectedStyle">
            <Style.Triggers>
                <DataTrigger Binding="{Binding IsSelected}" Value="False">
                    <DataTrigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetProperty="(Canvas.Opacity)" To="0" Duration="0:0:0.25" />
                            </Storyboard>
                        </BeginStoryboard>
                    </DataTrigger.EnterActions>
                    <DataTrigger.ExitActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetProperty="(Canvas.Opacity)" To="1" Duration="0:0:0.25" />
                            </Storyboard>
                        </BeginStoryboard>
                    </DataTrigger.ExitActions>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </UserControl.Resources>
    <Canvas Style="{StaticResource SelectedStyle}">
        <!-- The part of the layer's shape that falls outside the layer -->
        <Path Data="{Binding ShapeGeometry, Mode=OneWay}">
            <Path.Fill>
                <SolidColorBrush Color="{StaticResource Accent700}" Opacity="0.05" />
            </Path.Fill>
            <Path.Stroke>
                <SolidColorBrush Color="{StaticResource Accent700}" Opacity="0.15" />
            </Path.Stroke>
        </Path>

        <!-- The part of the layer's shape that is inside the layer -->
        <Path Data="{Binding ShapeGeometry, Mode=OneWay}">
            <Path.Fill>
                <SolidColorBrush Color="{StaticResource Accent700}" Opacity="0.15" />
            </Path.Fill>
            <Path.Stroke>
                <SolidColorBrush Color="{StaticResource Accent700}" />
            </Path.Stroke>
            <Path.OpacityMask>
                <VisualBrush Viewport="{Binding ViewportRectangle}" ViewportUnits="Absolute">
                    <VisualBrush.Visual>
                        <Path Data="{Binding LayerGeometry, Mode=OneWay}" ClipToBounds="False" Fill="Black" />
                    </VisualBrush.Visual>
                </VisualBrush>
            </Path.OpacityMask>
        </Path>

        <Path Data="{Binding LayerGeometry, Mode=OneWay}" ClipToBounds="False" StrokeThickness="1.5" StrokeLineJoin="Round" x:Name="LayerPath">
            <Path.Stroke>
                <SolidColorBrush Color="{StaticResource Accent400}" />
            </Path.Stroke>
        </Path>
    </Canvas>
</UserControl>