diff --git a/demo/Semi.Avalonia.Demo/Pages/NotificationDemo.axaml b/demo/Semi.Avalonia.Demo/Pages/NotificationDemo.axaml
index 66a8958..568bf5f 100644
--- a/demo/Semi.Avalonia.Demo/Pages/NotificationDemo.axaml
+++ b/demo/Semi.Avalonia.Demo/Pages/NotificationDemo.axaml
@@ -8,7 +8,7 @@
     d:DesignWidth="800"
     mc:Ignorable="d">
     <StackPanel Spacing="20">
-        <UniformGrid Rows="3" Columns="3" Width="500" HorizontalAlignment="Left">
+        <UniformGrid Rows="2" Columns="3" Width="500" HorizontalAlignment="Left">
             <UniformGrid.Styles>
                 <Style Selector="RadioButton">
                     <Setter Property="Theme" Value="{DynamicResource PureCardRadioButton}" />
diff --git a/src/Semi.Avalonia/Controls/NotificationCard.axaml b/src/Semi.Avalonia/Controls/NotificationCard.axaml
index 5348ac6..887e9ff 100644
--- a/src/Semi.Avalonia/Controls/NotificationCard.axaml
+++ b/src/Semi.Avalonia/Controls/NotificationCard.axaml
@@ -5,16 +5,17 @@
     <Design.PreviewWith>
         <ThemeVariantScope RequestedThemeVariant="Dark">
             <StackPanel>
+                <NotificationCard />
                 <NotificationCard>
                     Hello, Semi.Avalonia!
                 </NotificationCard>
                 <NotificationCard NotificationType="Success">
                     <Notification Title="Welcome" Message="Hello, Semi.Avalonia!" />
                 </NotificationCard>
-                <NotificationCard NotificationType="Warning">
-                    <Notification Title="" Message="Hello, Semi.Avalonia!" />
+                <NotificationCard NotificationType="Warning" Classes="Light">
+                    <Notification Title="Welcome" />
                 </NotificationCard>
-                <NotificationCard NotificationType="Error">
+                <NotificationCard NotificationType="Error" Classes="Light">
                     <Notification Message="Hello, Semi.Avalonia!" />
                 </NotificationCard>
             </StackPanel>
@@ -22,10 +23,7 @@
     </Design.PreviewWith>
     <ControlTheme x:Key="{x:Type NotificationCard}" TargetType="NotificationCard">
         <Setter Property="UseLayoutRounding" Value="True" />
-        <Setter Property="MinWidth" Value="{DynamicResource NotificationCardMinWidth}" />
-        <Setter Property="RenderTransformOrigin" Value="50%,75%" />
         <Setter Property="BorderThickness" Value="{DynamicResource NotificationCardBorderThickness}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource NotificationCardBorderBrush}" />
         <Setter Property="Background" Value="{DynamicResource NotificationCardBackground}" />
         <Setter Property="CornerRadius" Value="{DynamicResource NotificationCardCornerRadius}" />
         <Setter Property="Template">
@@ -38,11 +36,11 @@
                         <Border
                             x:Name="PART_RootBorder"
                             Padding="{DynamicResource NotificationCardPadding}"
-                            BoxShadow="{DynamicResource NotificationCardBoxShadow}"
+                            BoxShadow="{DynamicResource NotificationCardBoxShadows}"
                             BorderBrush="{TemplateBinding BorderBrush}"
                             BorderThickness="{TemplateBinding BorderThickness}"
                             CornerRadius="{TemplateBinding CornerRadius}">
-                            <DockPanel>
+                            <DockPanel MinWidth="{DynamicResource NotificationCardMinWidth}">
                                 <PathIcon
                                     Name="NotificationIcon"
                                     Width="{DynamicResource NotificationCardIconWidth}"
@@ -67,6 +65,7 @@
                                                     Foreground="{DynamicResource NotificationCardMessageForeground}"
                                                     FontSize="{DynamicResource NotificationCardMessageFontSize}"
                                                     FontWeight="{DynamicResource NotificationCardMessageFontWeight}"
+                                                    IsVisible="{Binding Message, Converter={x:Static StringConverters.IsNotNullOrEmpty}}"
                                                     Text="{Binding Message}"
                                                     TextWrapping="Wrap" />
                                             </StackPanel>
@@ -169,22 +168,22 @@
         </Style>
 
         <Style Selector="^.Light">
-            <Setter Property="Background" Value="{DynamicResource SemiColorBackground0}" />
+            <Setter Property="Background" Value="{DynamicResource NotificationCardLightBackground}" />
             <Style Selector="^:information /template/ Border#PART_RootBorder">
-                <Setter Property="BorderBrush" Value="{DynamicResource SemiColorInformation}" />
-                <Setter Property="Background" Value="{DynamicResource SemiColorInformationLight}" />
+                <Setter Property="BorderBrush" Value="{DynamicResource NotificationCardLightInformationBorderBrush}" />
+                <Setter Property="Background" Value="{DynamicResource NotificationCardLightInformationBackground}"/>
             </Style>
             <Style Selector="^:success /template/ Border#PART_RootBorder">
-                <Setter Property="BorderBrush" Value="{DynamicResource SemiColorSuccess}" />
-                <Setter Property="Background" Value="{DynamicResource SemiColorSuccessLight}" />
+                <Setter Property="BorderBrush" Value="{DynamicResource NotificationCardLightSuccessBorderBrush}" />
+                <Setter Property="Background" Value="{DynamicResource NotificationCardLightSuccessBackground}" />
             </Style>
             <Style Selector="^:warning /template/ Border#PART_RootBorder">
-                <Setter Property="BorderBrush" Value="{DynamicResource SemiColorWarning}" />
-                <Setter Property="Background" Value="{DynamicResource SemiColorWarningLight}" />
+                <Setter Property="BorderBrush" Value="{DynamicResource NotificationCardLightWarningBorderBrush}" />
+                <Setter Property="Background" Value="{DynamicResource NotificationCardLightWarningBackground}" />
             </Style>
             <Style Selector="^:error /template/ Border#PART_RootBorder">
-                <Setter Property="BorderBrush" Value="{DynamicResource SemiColorDanger}" />
-                <Setter Property="Background" Value="{DynamicResource SemiColorDangerLight}" />
+                <Setter Property="BorderBrush" Value="{DynamicResource NotificationCardLightErrorBorderBrush}" />
+                <Setter Property="Background" Value="{DynamicResource NotificationCardLightErrorBackground}" />
             </Style>
         </Style>
     </ControlTheme>
diff --git a/src/Semi.Avalonia/Themes/Dark/NotificationCard.axaml b/src/Semi.Avalonia/Themes/Dark/NotificationCard.axaml
index dc17611..56a1d39 100644
--- a/src/Semi.Avalonia/Themes/Dark/NotificationCard.axaml
+++ b/src/Semi.Avalonia/Themes/Dark/NotificationCard.axaml
@@ -5,7 +5,17 @@
     <SolidColorBrush x:Key="NotificationCardSuccessIconForeground" Color="#5DC264" />
     <SolidColorBrush x:Key="NotificationCardWarningIconForeground" Color="#FFAE43" />
     <SolidColorBrush x:Key="NotificationCardErrorIconForeground" Color="#FC725A" />
-    <BoxShadows x:Key="NotificationCardBoxShadows">0 0 8 0 #1AFFFFFF</BoxShadows>
+    <BoxShadows x:Key="NotificationCardBoxShadows">inset 0 0 0 1 #1AFFFFFF, 0 4 14 0 #40000000</BoxShadows>
     <SolidColorBrush x:Key="NotificationCardTitleForeground" Color="#F9F9F9" />
     <SolidColorBrush x:Key="NotificationCardMessageForeground" Opacity="0.8" Color="#F9F9F9" />
+    
+    <SolidColorBrush x:Key="NotificationCardLightBackground" Color="#16161A" />
+    <SolidColorBrush x:Key="NotificationCardLightInformationBorderBrush" Color="#54A9FF" />
+    <SolidColorBrush x:Key="NotificationCardLightInformationBackground" Opacity="0.2" Color="#54A9FF" />
+    <SolidColorBrush x:Key="NotificationCardLightSuccessBorderBrush" Color="#5DC264" />
+    <SolidColorBrush x:Key="NotificationCardLightSuccessBackground" Opacity="0.2" Color="#5DC264" />
+    <SolidColorBrush x:Key="NotificationCardLightWarningBorderBrush" Color="#FFAE43" />
+    <SolidColorBrush x:Key="NotificationCardLightWarningBackground" Opacity="0.2" Color="#FFAE43" />
+    <SolidColorBrush x:Key="NotificationCardLightErrorBorderBrush" Color="#FC725A" />
+    <SolidColorBrush x:Key="NotificationCardLightErrorBackground" Opacity="0.2" Color="#FC725A" />
 </ResourceDictionary>
diff --git a/src/Semi.Avalonia/Themes/Light/NotificationCard.axaml b/src/Semi.Avalonia/Themes/Light/NotificationCard.axaml
index 4541075..a25270d 100644
--- a/src/Semi.Avalonia/Themes/Light/NotificationCard.axaml
+++ b/src/Semi.Avalonia/Themes/Light/NotificationCard.axaml
@@ -5,7 +5,17 @@
     <SolidColorBrush x:Key="NotificationCardSuccessIconForeground" Color="#3BB346" />
     <SolidColorBrush x:Key="NotificationCardWarningIconForeground" Color="#FC8800" />
     <SolidColorBrush x:Key="NotificationCardErrorIconForeground" Color="#F93920" />
-    <BoxShadows x:Key="NotificationCardBoxShadows">0 0 8 0 #1A000000</BoxShadows>
+    <BoxShadows x:Key="NotificationCardBoxShadows">0 0 1 0 #4A000000, 0 4 14 0 #1A000000</BoxShadows>
     <SolidColorBrush x:Key="NotificationCardTitleForeground" Color="#1C1F23" />
     <SolidColorBrush x:Key="NotificationCardMessageForeground" Opacity="0.8" Color="#1C1F23" />
+
+    <SolidColorBrush x:Key="NotificationCardLightBackground" Color="White" />
+    <SolidColorBrush x:Key="NotificationCardLightInformationBorderBrush" Color="#0077FA" />
+    <SolidColorBrush x:Key="NotificationCardLightInformationBackground" Color="#EAF5FF" />
+    <SolidColorBrush x:Key="NotificationCardLightSuccessBorderBrush" Color="#3BB346" />
+    <SolidColorBrush x:Key="NotificationCardLightSuccessBackground" Color="#ECF7EC" />
+    <SolidColorBrush x:Key="NotificationCardLightWarningBorderBrush" Color="#FC8800" />
+    <SolidColorBrush x:Key="NotificationCardLightWarningBackground" Color="#FFF8EA" />
+    <SolidColorBrush x:Key="NotificationCardLightErrorBorderBrush" Color="#F93920" />
+    <SolidColorBrush x:Key="NotificationCardLightErrorBackground" Color="#FEF2ED" />
 </ResourceDictionary>
\ No newline at end of file
diff --git a/src/Semi.Avalonia/Themes/Shared/NotificationCard.axaml b/src/Semi.Avalonia/Themes/Shared/NotificationCard.axaml
index 4e5476c..9310982 100644
--- a/src/Semi.Avalonia/Themes/Shared/NotificationCard.axaml
+++ b/src/Semi.Avalonia/Themes/Shared/NotificationCard.axaml
@@ -3,7 +3,7 @@
     <Thickness x:Key="NotificationCardBorderThickness">1</Thickness>
     <CornerRadius x:Key="NotificationCardCornerRadius">6</CornerRadius>
     <Thickness x:Key="NotificationCardMargin">8</Thickness>
-    <Thickness x:Key="NotificationCardPadding">16 12</Thickness>
+    <Thickness x:Key="NotificationCardPadding">20 16 12 16</Thickness>
 
     <x:Double x:Key="NotificationCardIconWidth">18</x:Double>
     <x:Double x:Key="NotificationCardIconHeight">18</x:Double>