diff --git a/SukiUI.Demo/Features/ControlsLibrary/InfoBarView.axaml b/SukiUI.Demo/Features/ControlsLibrary/InfoBarView.axaml
new file mode 100644
index 000000000..166180262
--- /dev/null
+++ b/SukiUI.Demo/Features/ControlsLibrary/InfoBarView.axaml
@@ -0,0 +1,80 @@
+
+
+
+
+
+
+ InfoBar is a control that displays a message to the user. It can be used to show specific severity message to the user.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/SukiUI.Demo/Features/ControlsLibrary/InfoBarView.axaml.cs b/SukiUI.Demo/Features/ControlsLibrary/InfoBarView.axaml.cs
new file mode 100644
index 000000000..06f74081e
--- /dev/null
+++ b/SukiUI.Demo/Features/ControlsLibrary/InfoBarView.axaml.cs
@@ -0,0 +1,11 @@
+using Avalonia.Controls;
+
+namespace SukiUI.Demo.Features.ControlsLibrary;
+
+public partial class InfoBarView : UserControl
+{
+ public InfoBarView()
+ {
+ InitializeComponent();
+ }
+}
\ No newline at end of file
diff --git a/SukiUI.Demo/Features/ControlsLibrary/InfoBarViewModel.cs b/SukiUI.Demo/Features/ControlsLibrary/InfoBarViewModel.cs
new file mode 100644
index 000000000..e72a25a57
--- /dev/null
+++ b/SukiUI.Demo/Features/ControlsLibrary/InfoBarViewModel.cs
@@ -0,0 +1,20 @@
+using CommunityToolkit.Mvvm.ComponentModel;
+using CommunityToolkit.Mvvm.Input;
+using Material.Icons;
+
+namespace SukiUI.Demo.Features.ControlsLibrary;
+
+public partial class InfoBarViewModel() : DemoPageBase("InfoBar", MaterialIconKind.InfoOutline)
+{
+ [ObservableProperty]
+ private bool _isOpen = true;
+
+ [ObservableProperty]
+ private bool _isClosable = true;
+
+ [RelayCommand]
+ private void RefreshIsOpenStatus()
+ {
+ IsOpen = true;
+ }
+}
\ No newline at end of file
diff --git a/SukiUI/Controls/InfoBar.axaml b/SukiUI/Controls/InfoBar.axaml
index 0331f0c97..389362c92 100644
--- a/SukiUI/Controls/InfoBar.axaml
+++ b/SukiUI/Controls/InfoBar.axaml
@@ -14,12 +14,13 @@
-
-
+
@@ -76,9 +77,6 @@
-