Ursa.Avalonia/src/Ursa.Themes.Semi/Controls/Avatar.axaml

<ResourceDictionary
    xmlns="https://github.com/avaloniaui"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:u="https://irihi.tech/ursa"
    xmlns:converters="clr-namespace:Ursa.Converters;assembly=Ursa">
    <converters:DivideByTwoConverter x:Key="DivideByTwoConverter" />
    <ControlTheme x:Key="{x:Type u:Avatar}" TargetType="{x:Type u:Avatar}">
        <Setter Property="Foreground" Value="White" />
        <Setter Property="Background" Value="{DynamicResource SemiGrey3}" />
        <Setter Property="FontSize" Value="20" />
        <Setter Property="FontWeight" Value="Bold" />
        <Setter Property="Width" Value="48" />
        <Setter Property="Height" Value="{Binding $self.Width}" />
        <Setter Property="Cursor" Value="Hand" />
        <Setter Property="CornerRadius" Value="100" />
        <Setter Property="Template">
            <ControlTemplate TargetType="{x:Type u:Avatar}">
                <Border
                    CornerRadius="{TemplateBinding CornerRadius}"
                    ClipToBounds="True">
                    <Panel>
                        <Border
                            IsVisible="{TemplateBinding Source, Converter={x:Static ObjectConverters.IsNull}}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            CornerRadius="{TemplateBinding CornerRadius}"
                            Background="{TemplateBinding Background}" />
                        <ContentPresenter
                            Name="PART_ContentPresenter"
                            IsVisible="{TemplateBinding Source, Converter={x:Static ObjectConverters.IsNull}}"
                            CornerRadius="{TemplateBinding CornerRadius}"
                            Content="{TemplateBinding Content}"
                            HorizontalContentAlignment="Center"
                            VerticalContentAlignment="Center" />
                        <ContentPresenter
                            Name="{x:Static u:Avatar.PART_HoverMask}"
                            IsVisible="False"
                            Content="{TemplateBinding HoverMask}"
                            CornerRadius="{TemplateBinding CornerRadius}"
                            HorizontalContentAlignment="Center"
                            VerticalContentAlignment="Center" />
                        <Image Source="{TemplateBinding Source}" />
                        <DockPanel>
                            <ContentPresenter DockPanel.Dock="Top" />
                            <ContentPresenter DockPanel.Dock="Bottom" />
                        </DockPanel>
                    </Panel>
                </Border>
            </ControlTemplate>
        </Setter>
        <Style Selector="^:pointerover /template/ ContentPresenter#PART_HoverMask">
            <Setter Property="IsVisible"
                    Value="{Binding HoverMask,RelativeSource={RelativeSource TemplatedParent},
                        Converter={x:Static ObjectConverters.IsNotNull}}" />
        </Style>
        <Style Selector="^.Red">
            <Setter Property="Background" Value="{DynamicResource SemiRed3}" />
        </Style>
        <Style Selector="^.Pink">
            <Setter Property="Background" Value="{DynamicResource SemiPink3}" />
        </Style>
        <Style Selector="^.Purple">
            <Setter Property="Background" Value="{DynamicResource SemiPurple3}" />
        </Style>
        <Style Selector="^.Violet">
            <Setter Property="Background" Value="{DynamicResource SemiViolet3}" />
        </Style>
        <Style Selector="^.Indigo">
            <Setter Property="Background" Value="{DynamicResource SemiIndigo3}" />
        </Style>
        <Style Selector="^.Blue">
            <Setter Property="Background" Value="{DynamicResource SemiBlue3}" />
        </Style>
        <Style Selector="^.LightBlue">
            <Setter Property="Background" Value="{DynamicResource SemiLightBlue3}" />
        </Style>
        <Style Selector="^.Cyan">
            <Setter Property="Background" Value="{DynamicResource SemiCyan3}" />
        </Style>
        <Style Selector="^.Teal">
            <Setter Property="Background" Value="{DynamicResource SemiTeal3}" />
        </Style>
        <Style Selector="^.Green">
            <Setter Property="Background" Value="{DynamicResource SemiGreen3}" />
        </Style>
        <Style Selector="^.LightGreen">
            <Setter Property="Background" Value="{DynamicResource SemiLightGreen3}" />
        </Style>
        <Style Selector="^.Lime">
            <Setter Property="Background" Value="{DynamicResource SemiLime3}" />
        </Style>
        <Style Selector="^.Yellow">
            <Setter Property="Background" Value="{DynamicResource SemiYellow3}" />
        </Style>
        <Style Selector="^.Amber">
            <Setter Property="Background" Value="{DynamicResource SemiAmber3}" />
        </Style>
        <Style Selector="^.Orange">
            <Setter Property="Background" Value="{DynamicResource SemiOrange3}" />
        </Style>
        <Style Selector="^.Grey">
            <Setter Property="Background" Value="{DynamicResource SemiGrey3}" />
        </Style>

        <Style Selector="^.Square">
            <Setter Property="CornerRadius" Value="3" />
        </Style>

        <Style Selector="^.ExtraExtraSmall">
            <Setter Property="Width" Value="20" />
            <Setter Property="FontSize" Value="10" />
        </Style>
        <Style Selector="^.ExtraSmall">
            <Setter Property="Width" Value="24" />
            <Setter Property="FontSize" Value="10" />
        </Style>
        <Style Selector="^.Small">
            <Setter Property="Width" Value="32" />
            <Setter Property="FontSize" Value="12" />
        </Style>
        <Style Selector="^.Default">
            <Setter Property="Width" Value="40" />
            <Setter Property="FontSize" Value="18" />
        </Style>
        <Style Selector="^.Medium">
            <Setter Property="Width" Value="48" />
            <Setter Property="FontSize" Value="20" />
        </Style>
        <Style Selector="^.Large">
            <Setter Property="Width" Value="72" />
            <Setter Property="FontSize" Value="32" />
            <Style Selector="^.Square">
                <Setter Property="CornerRadius" Value="6" />
            </Style>
        </Style>
        <Style Selector="^.ExtraLarge">
            <Setter Property="Width" Value="128" />
            <Setter Property="FontSize" Value="64" />
            <Style Selector="^.Square">
                <Setter Property="CornerRadius" Value="12" />
            </Style>
        </Style>
    </ControlTheme>

    <ControlTheme x:Key="{x:Type u:AvatarGroup}" TargetType="{x:Type u:AvatarGroup}">
        <Setter Property="Template">
            <ControlTemplate TargetType="u:AvatarGroup">
                <ItemsPresenter ItemsPanel="{TemplateBinding ItemsPanel}" />
            </ControlTemplate>
        </Setter>
    </ControlTheme>
</ResourceDictionary>