diff --git a/src/Avalonia/HandyControlDemo_Avalonia/Data/DemoInfo.json b/src/Avalonia/HandyControlDemo_Avalonia/Data/DemoInfo.json
index 6644a740..09954a0f 100644
--- a/src/Avalonia/HandyControlDemo_Avalonia/Data/DemoInfo.json
+++ b/src/Avalonia/HandyControlDemo_Avalonia/Data/DemoInfo.json
@@ -56,7 +56,8 @@
       [ "Rate", "RateDemo", "Brush.Favorite", "", "Feedback" ],
       [ "Loading", "LoadingDemo", "Brush.Loading", "", "Feedback" ],
       [ "Tag", "TagDemo", "Brush.Tag", "", "DataDisplay" ],
-      [ "Badge", "BadgeDemo", "Brush.CheckDot", "", "DataDisplay" ]
+      [ "Badge", "BadgeDemo", "Brush.CheckDot", "", "DataDisplay" ],
+      [ "Shield", "ShieldDemo", "Brush.SplitKeyValuePair", "", "DataDisplay" ]
     ]
   }
 ]
diff --git a/src/Avalonia/HandyControlDemo_Avalonia/UserControl/Controls/BadgeDemo.axaml b/src/Avalonia/HandyControlDemo_Avalonia/UserControl/Controls/BadgeDemo.axaml
index f690f978..df1beeb5 100644
--- a/src/Avalonia/HandyControlDemo_Avalonia/UserControl/Controls/BadgeDemo.axaml
+++ b/src/Avalonia/HandyControlDemo_Avalonia/UserControl/Controls/BadgeDemo.axaml
@@ -1,9 +1,10 @@
 <UserControl xmlns="https://github.com/avaloniaui"
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
              xmlns:hc="https://handyorg.github.io/handycontrol"
+             xmlns:langs="clr-namespace:HandyControlDemo.Properties.Langs"
              x:Class="HandyControlDemo.UserControl.BadgeDemo"
              Background="{DynamicResource RegionBrush}">
-    <ScrollViewer>
+    <TransitioningContentControl>
         <hc:UniformSpacingPanel Margin="32"
                                 Spacing="32"
                                 ChildWrapping="Wrap"
@@ -12,13 +13,13 @@
             <hc:Badge Text="New"
                       BadgeMargin="0,-14,-20,0"
                       Height="30">
-                <Button Content="Comment" />
+                <Button Content="{x:Static langs:Lang.Comment}" />
             </hc:Badge>
             <hc:Badge Text="New"
                       BadgeMargin="0,-14,-20,0"
                       Height="30"
                       Theme="{StaticResource BadgeDanger}">
-                <Button Content="Comment" />
+                <Button Content="{x:Static langs:Lang.Comment}" />
             </hc:Badge>
             <hc:Badge Name="CountBadge"
                       Value="0"
@@ -26,24 +27,24 @@
                       Height="30"
                       Theme="{StaticResource BadgePrimary}">
                 <Button Name="CountButton"
-                        Content="Click to Count" />
+                        Content="{x:Static langs:Lang.Click2Count}" />
             </hc:Badge>
             <hc:Badge Value="100"
                       BadgeMargin="0,-14,-20,0"
                       Height="30"
                       Theme="{StaticResource BadgeDanger}">
-                <Button Content="Comment" />
+                <Button Content="{x:Static langs:Lang.Comment}" />
             </hc:Badge>
             <hc:Badge Status="Dot"
                       Height="30"
                       Theme="{StaticResource BadgeDanger}">
-                <Button Content="Reply" />
+                <Button Content="{x:Static langs:Lang.Reply}" />
             </hc:Badge>
             <hc:Badge Status="Processing"
                       Height="30"
                       Theme="{StaticResource BadgeDanger}">
-                <Button Content="Reply" />
+                <Button Content="{x:Static langs:Lang.Reply}" />
             </hc:Badge>
         </hc:UniformSpacingPanel>
-    </ScrollViewer>
+    </TransitioningContentControl>
 </UserControl>
diff --git a/src/Avalonia/HandyControlDemo_Avalonia/UserControl/Controls/ShieldDemo.axaml b/src/Avalonia/HandyControlDemo_Avalonia/UserControl/Controls/ShieldDemo.axaml
new file mode 100644
index 00000000..85b97c88
--- /dev/null
+++ b/src/Avalonia/HandyControlDemo_Avalonia/UserControl/Controls/ShieldDemo.axaml
@@ -0,0 +1,22 @@
+<UserControl xmlns="https://github.com/avaloniaui"
+             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+             xmlns:hc="https://handyorg.github.io/handycontrol"
+             x:Class="HandyControlDemo.UserControl.ShieldDemo"
+             Background="{DynamicResource RegionBrush}">
+    <TransitioningContentControl>
+        <StackPanel Orientation="Horizontal"
+                    Margin="32">
+            <hc:Shield Subject=".net"
+                       Status=">=4.0"
+                       Color="#1182c3" />
+            <hc:Shield Subject="c#"
+                       Status="7.0"
+                       Margin="4,0,0,0"
+                       Color="#1182c3" />
+            <hc:Shield Subject="IDE"
+                       Status="2017"
+                       Margin="4,0,0,0"
+                       Color="#1182c3" />
+        </StackPanel>
+    </TransitioningContentControl>
+</UserControl>
diff --git a/src/Avalonia/HandyControlDemo_Avalonia/UserControl/Controls/ShieldDemo.axaml.cs b/src/Avalonia/HandyControlDemo_Avalonia/UserControl/Controls/ShieldDemo.axaml.cs
new file mode 100644
index 00000000..5ab8aed4
--- /dev/null
+++ b/src/Avalonia/HandyControlDemo_Avalonia/UserControl/Controls/ShieldDemo.axaml.cs
@@ -0,0 +1,9 @@
+namespace HandyControlDemo.UserControl;
+
+public partial class ShieldDemo : Avalonia.Controls.UserControl
+{
+    public ShieldDemo()
+    {
+        InitializeComponent();
+    }
+}
diff --git a/src/Avalonia/HandyControl_Avalonia/Controls/Other/Shield.cs b/src/Avalonia/HandyControl_Avalonia/Controls/Other/Shield.cs
new file mode 100644
index 00000000..9f3ac7b5
--- /dev/null
+++ b/src/Avalonia/HandyControl_Avalonia/Controls/Other/Shield.cs
@@ -0,0 +1,40 @@
+using Avalonia;
+using Avalonia.Controls;
+using Avalonia.Media;
+using Avalonia.Metadata;
+
+namespace HandyControl.Controls;
+
+/// <summary>
+///     徽章
+/// </summary>
+public class Shield : Button
+{
+    public static readonly StyledProperty<string?> SubjectProperty =
+        AvaloniaProperty.Register<Shield, string?>(nameof(Subject));
+
+    public string? Subject
+    {
+        get => GetValue(SubjectProperty);
+        set => SetValue(SubjectProperty, value);
+    }
+
+    public static readonly StyledProperty<object?> StatusProperty =
+        AvaloniaProperty.Register<Shield, object?>(nameof(Status));
+
+    [Content]
+    public object? Status
+    {
+        get => GetValue(StatusProperty);
+        set => SetValue(StatusProperty, value);
+    }
+
+    public static readonly StyledProperty<IBrush?> ColorProperty =
+        AvaloniaProperty.Register<Shield, IBrush?>(nameof(Color));
+
+    public IBrush? Color
+    {
+        get => GetValue(ColorProperty);
+        set => SetValue(ColorProperty, value);
+    }
+}
diff --git a/src/Avalonia/HandyControl_Avalonia/Themes/Styles/MergedStyles.axaml b/src/Avalonia/HandyControl_Avalonia/Themes/Styles/MergedStyles.axaml
index 5ef7783b..dab03312 100644
--- a/src/Avalonia/HandyControl_Avalonia/Themes/Styles/MergedStyles.axaml
+++ b/src/Avalonia/HandyControl_Avalonia/Themes/Styles/MergedStyles.axaml
@@ -72,6 +72,7 @@
                 <MergeResourceInclude Source="avares://HandyControl/Themes/Styles/Gravatar.axaml" />
                 <MergeResourceInclude Source="avares://HandyControl/Themes/Styles/Tag.axaml" />
                 <MergeResourceInclude Source="avares://HandyControl/Themes/Styles/Badge.axaml" />
+                <MergeResourceInclude Source="avares://HandyControl/Themes/Styles/Shield.axaml" />
             </ResourceDictionary.MergedDictionaries>
         </ResourceDictionary>
     </Styles.Resources>
diff --git a/src/Avalonia/HandyControl_Avalonia/Themes/Styles/Shield.axaml b/src/Avalonia/HandyControl_Avalonia/Themes/Styles/Shield.axaml
new file mode 100644
index 00000000..ed5b9619
--- /dev/null
+++ b/src/Avalonia/HandyControl_Avalonia/Themes/Styles/Shield.axaml
@@ -0,0 +1,53 @@
+<ResourceDictionary xmlns="https://github.com/avaloniaui"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    x:ClassModifier="internal"
+                    xmlns:hc="clr-namespace:HandyControl.Controls">
+
+    <ControlTheme x:Key="ShieldBaseStyle"
+                  TargetType="hc:Shield">
+        <Setter Property="Height"
+                Value="20" />
+        <Setter Property="Foreground"
+                Value="{DynamicResource TextIconBrush}" />
+        <Setter Property="hc:BorderElement.CornerRadius"
+                Value="3" />
+        <Setter Property="BorderThickness"
+                Value="0" />
+        <Setter Property="BorderBrush"
+                Value="{DynamicResource BorderBrush}" />
+        <Setter Property="Color"
+                Value="{DynamicResource PrimaryBrush}" />
+        <Setter Property="Template">
+            <ControlTemplate TargetType="hc:Shield">
+                <Grid>
+                    <Grid.ColumnDefinitions>
+                        <ColumnDefinition Width="Auto" />
+                        <ColumnDefinition Width="Auto" />
+                    </Grid.ColumnDefinitions>
+                    <Border Grid.Column="0"
+                            Background="#555"
+                            CornerRadius="{Binding Path=(hc:BorderElement.CornerRadius), RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource CornerRadiusSplitConverter}, ConverterParameter='1,0,0,1'}">
+                        <TextBlock Text="{TemplateBinding Subject}"
+                                   Foreground="{TemplateBinding Foreground}"
+                                   VerticalAlignment="Center"
+                                   Margin="4,0" />
+                    </Border>
+                    <Border Grid.Column="1"
+                            Background="{TemplateBinding Color}"
+                            CornerRadius="{Binding Path=(hc:BorderElement.CornerRadius), RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource CornerRadiusSplitConverter}, ConverterParameter='0,1,1,0'}">
+                        <ContentPresenter Content="{TemplateBinding Status}"
+                                          ContentTemplate="{TemplateBinding ContentTemplate}"
+                                          VerticalAlignment="Center"
+                                          Margin="4,0"
+                                          TextElement.Foreground="{TemplateBinding Foreground}" />
+                    </Border>
+                </Grid>
+            </ControlTemplate>
+        </Setter>
+    </ControlTheme>
+
+    <ControlTheme x:Key="{x:Type hc:Shield}"
+                  BasedOn="{StaticResource ShieldBaseStyle}"
+                  TargetType="hc:Shield" />
+
+</ResourceDictionary>