diff --git a/src/BlazorUI/Bit.BlazorUI.Tests/Components/Utilities/Stack/BitStackTests.cs b/src/BlazorUI/Bit.BlazorUI.Tests/Components/Utilities/Stack/BitStackTests.cs
index eb256e3d94..612beb7857 100644
--- a/src/BlazorUI/Bit.BlazorUI.Tests/Components/Utilities/Stack/BitStackTests.cs
+++ b/src/BlazorUI/Bit.BlazorUI.Tests/Components/Utilities/Stack/BitStackTests.cs
@@ -9,7 +9,7 @@ namespace Bit.BlazorUI.Tests.Components.Utilities.Stack;
 [TestClass]
 public class BitStackTests : BunitTestContext
 {
-    private const string STYLE = "flex-direction:column;align-items:flex-start;justify-content:flex-start;";
+    private const string STYLE = "flex-direction:column;gap:1rem;";
 
     private static readonly Dictionary<BitAlignment, string> _AlignmentMap = new()
     {
@@ -272,9 +272,9 @@ public void BitStackShouldRespectGap(string gap)
             parameters.Add(p => p.Gap, gap);
         });
 
-        var style = gap.HasValue() ? $"gap:{gap}" : null;
+        var style = gap.HasValue() ? $"gap:{gap}" : $"gap:1rem";
 
-        component.MarkupMatches(@$"<div style=""{STYLE}{style}"" class=""bit-stc"" id:ignore></div>");
+        component.MarkupMatches(@$"<div style=""flex-direction:column;{style}"" class=""bit-stc"" id:ignore></div>");
     }
 
     [DataTestMethod]
@@ -290,7 +290,7 @@ public void BitStackShouldRespectGapChangingAfterRender()
             parameters.Add(p => p.Gap, gap);
         });
 
-        component.MarkupMatches(@$"<div style=""{STYLE}gap:{gap};"" class=""bit-stc"" id:ignore></div>");
+        component.MarkupMatches(@$"<div style=""flex-direction:column;gap:{gap};"" class=""bit-stc"" id:ignore></div>");
     }
 
     [DataTestMethod,
@@ -371,7 +371,7 @@ public void BitStackShouldRespectHorizontal(bool horizontal)
 
         var fd = horizontal ? "row" : "column";
 
-        component.MarkupMatches(@$"<div style=""flex-direction:{fd};align-items:flex-start;justify-content:flex-start;"" class=""bit-stc"" id:ignore></div>");
+        component.MarkupMatches(@$"<div style=""flex-direction:{fd};gap:1rem"" class=""bit-stc"" id:ignore></div>");
     }
 
     [DataTestMethod]
@@ -386,7 +386,7 @@ public void BitStackShouldRespectHorizontalChangingAfterRender()
             parameters.Add(p => p.Horizontal, true);
         });
 
-        component.MarkupMatches(@$"<div style=""flex-direction:row;align-items:flex-start;justify-content:flex-start;"" class=""bit-stc"" id:ignore></div>");
+        component.MarkupMatches(@$"<div style=""flex-direction:row;gap:1rem"" class=""bit-stc"" id:ignore></div>");
     }
 
     [DataTestMethod,
@@ -408,7 +408,7 @@ public void BitStackShouldRespectHorizontalAlign(BitAlignment horizontalAlign)
 
         var ai = _AlignmentMap[horizontalAlign];
 
-        component.MarkupMatches(@$"<div style=""flex-direction:column;align-items:{ai};justify-content:flex-start;"" class=""bit-stc"" id:ignore></div>");
+        component.MarkupMatches(@$"<div style=""flex-direction:column;gap:1rem;align-items:{ai}"" class=""bit-stc"" id:ignore></div>");
     }
 
     [DataTestMethod]
@@ -423,7 +423,7 @@ public void BitStackShouldRespectHorizontalAlignChangingAfterRender()
             parameters.Add(p => p.HorizontalAlign, BitAlignment.SpaceBetween);
         });
 
-        component.MarkupMatches(@$"<div style=""flex-direction:column;align-items:space-between;justify-content:flex-start;"" class=""bit-stc"" id:ignore></div>");
+        component.MarkupMatches(@$"<div style=""flex-direction:column;gap:1rem;align-items:space-between"" class=""bit-stc"" id:ignore></div>");
     }
 
     [DataTestMethod,
@@ -439,7 +439,7 @@ public void BitStackShouldRespectReversed(bool reversed)
 
         var fd = reversed ? "column-reverse" : "column";
 
-        component.MarkupMatches(@$"<div style=""flex-direction:{fd};align-items:flex-start;justify-content:flex-start;"" class=""bit-stc"" id:ignore></div>");
+        component.MarkupMatches(@$"<div style=""flex-direction:{fd};gap:1rem"" class=""bit-stc"" id:ignore></div>");
     }
 
     [DataTestMethod]
@@ -454,7 +454,7 @@ public void BitStackShouldRespectReversedChangingAfterRender()
             parameters.Add(p => p.Reversed, true);
         });
 
-        component.MarkupMatches(@$"<div style=""flex-direction:column-reverse;align-items:flex-start;justify-content:flex-start;"" class=""bit-stc"" id:ignore></div>");
+        component.MarkupMatches(@$"<div style=""flex-direction:column-reverse;gap:1rem"" class=""bit-stc"" id:ignore></div>");
     }
 
     [DataTestMethod,
@@ -476,7 +476,7 @@ public void BitStackShouldRespectBitAlignment(BitAlignment verticalAlign)
 
         var jc = _AlignmentMap[verticalAlign];
 
-        component.MarkupMatches(@$"<div style=""flex-direction:column;align-items:flex-start;justify-content:{jc};"" class=""bit-stc"" id:ignore></div>");
+        component.MarkupMatches(@$"<div style=""flex-direction:column;gap:1rem;justify-content:{jc}"" class=""bit-stc"" id:ignore></div>");
     }
 
     [DataTestMethod]
@@ -491,7 +491,7 @@ public void BitStackShouldRespectVerticalAlignChangingAfterRender()
             parameters.Add(p => p.VerticalAlign, BitAlignment.SpaceBetween);
         });
 
-        component.MarkupMatches(@$"<div style=""flex-direction:column;align-items:flex-start;justify-content:space-between;"" class=""bit-stc"" id:ignore></div>");
+        component.MarkupMatches(@$"<div style=""flex-direction:column;gap:1rem;justify-content:space-between;"" class=""bit-stc"" id:ignore></div>");
     }
 
     [DataTestMethod,
@@ -560,7 +560,7 @@ public void BitStackShouldRespectHorizontalAndReversed(bool horizontal, bool rev
 
         var fd = $"{(horizontal ? "row" : "column")}{(reversed ? "-reverse" : null)}";
 
-        component.MarkupMatches(@$"<div style=""flex-direction:{fd};align-items:flex-start;justify-content:flex-start;"" class=""bit-stc"" id:ignore></div>");
+        component.MarkupMatches(@$"<div style=""flex-direction:{fd};gap:1rem"" class=""bit-stc"" id:ignore></div>");
     }
 
     [DataTestMethod,
@@ -586,7 +586,7 @@ public void BitStackShouldRespectHorizontalAndReversedAndHorizontalAlignAndVerti
                 var ai = _AlignmentMap[horizontal ? verticalAlign : horizontalAlign];
                 var jc = _AlignmentMap[horizontal ? horizontalAlign : verticalAlign];
 
-                component.MarkupMatches(@$"<div style=""flex-direction:{fd};align-items:{ai};justify-content:{jc};"" class=""bit-stc"" id:ignore></div>");
+                component.MarkupMatches(@$"<div style=""flex-direction:{fd};gap:1rem;align-items:{ai};justify-content:{jc};"" class=""bit-stc"" id:ignore></div>");
             }
         }
     }
@@ -599,10 +599,10 @@ public void BitStackShouldRespectFull(bool full)
     {
         var component = RenderComponent<BitStack>(parameters =>
         {
-            parameters.Add(p => p.Full, full);
+            parameters.Add(p => p.AutoSize, full);
         });
 
-        var style = full ? "width:100%;height:100%;" : null;
+        var style = full ? "width:auto;height:auto;" : null;
 
         component.MarkupMatches(@$"<div style=""{STYLE}{style}"" class=""bit-stc"" id:ignore></div>");
     }
@@ -616,24 +616,24 @@ public void BitStackShouldRespectFullChangingAfterRender()
 
         component.SetParametersAndRender(parameters =>
         {
-            parameters.Add(p => p.Full, true);
+            parameters.Add(p => p.AutoSize, true);
         });
 
-        component.MarkupMatches(@$"<div style=""{STYLE}width:100%;height:100%;"" class=""bit-stc"" id:ignore></div>");
+        component.MarkupMatches(@$"<div style=""{STYLE}width:auto;height:auto;"" class=""bit-stc"" id:ignore></div>");
     }
 
     [DataTestMethod,
         DataRow(true),
         DataRow(false)
     ]
-    public void BitStackShouldRespectFullWidth(bool fullWidth)
+    public void BitStackShouldRespectFullWidth(bool autoWidth)
     {
         var component = RenderComponent<BitStack>(parameters =>
         {
-            parameters.Add(p => p.FullWidth, fullWidth);
+            parameters.Add(p => p.AutoWidth, autoWidth);
         });
 
-        var style = fullWidth ? "width:100%;" : null;
+        var style = autoWidth ? "width:auto;" : null;
 
         component.MarkupMatches(@$"<div style=""{STYLE}{style}"" class=""bit-stc"" id:ignore></div>");
     }
@@ -647,24 +647,24 @@ public void BitStackShouldRespectFullWidthChangingAfterRender()
 
         component.SetParametersAndRender(parameters =>
         {
-            parameters.Add(p => p.FullWidth, true);
+            parameters.Add(p => p.AutoWidth, true);
         });
 
-        component.MarkupMatches(@$"<div style=""{STYLE}width:100%;"" class=""bit-stc"" id:ignore></div>");
+        component.MarkupMatches(@$"<div style=""{STYLE}width:auto;"" class=""bit-stc"" id:ignore></div>");
     }
 
     [DataTestMethod,
         DataRow(true),
         DataRow(false)
     ]
-    public void BitStackShouldRespectFullHeight(bool fullHeight)
+    public void BitStackShouldRespectFullHeight(bool autoHeight)
     {
         var component = RenderComponent<BitStack>(parameters =>
         {
-            parameters.Add(p => p.FullHeight, fullHeight);
+            parameters.Add(p => p.AutoHeight, autoHeight);
         });
 
-        var style = fullHeight ? "height:100%;" : null;
+        var style = autoHeight ? "height:auto;" : null;
 
         component.MarkupMatches(@$"<div style=""{STYLE}{style}"" class=""bit-stc"" id:ignore></div>");
     }
@@ -678,10 +678,10 @@ public void BitStackShouldRespectFullHeightChangingAfterRender()
 
         component.SetParametersAndRender(parameters =>
         {
-            parameters.Add(p => p.FullHeight, true);
+            parameters.Add(p => p.AutoHeight, true);
         });
 
-        component.MarkupMatches(@$"<div style=""{STYLE}height:100%;"" class=""bit-stc"" id:ignore></div>");
+        component.MarkupMatches(@$"<div style=""{STYLE}height:auto;"" class=""bit-stc"" id:ignore></div>");
     }
 
     [DataTestMethod,
@@ -694,25 +694,25 @@ public void BitStackShouldRespectFullHeightChangingAfterRender()
         DataRow(false, false, true),
         DataRow(false, false, false)
     ]
-    public void BitStackShouldRespectFullAndFullWidthAndFullHeight(bool full, bool fullWidth, bool fullHeight)
+    public void BitStackShouldRespectFullAndFullWidthAndFullHeight(bool autoSize, bool autoWidth, bool autoHeight)
     {
         var component = RenderComponent<BitStack>(parameters =>
         {
-            parameters.Add(p => p.Full, full);
-            parameters.Add(p => p.FullWidth, fullWidth);
-            parameters.Add(p => p.FullHeight, fullHeight);
+            parameters.Add(p => p.AutoSize, autoSize);
+            parameters.Add(p => p.AutoWidth, autoWidth);
+            parameters.Add(p => p.AutoHeight, autoHeight);
         });
 
         StringBuilder style = new();
 
-        if (full || fullWidth)
+        if (autoSize || autoWidth)
         {
-            style.Append("width:100%;");
+            style.Append("width:auto;");
         }
 
-        if (full || fullHeight)
+        if (autoSize || autoHeight)
         {
-            style.Append("height:100%;");
+            style.Append("height:auto;");
         }
 
         component.MarkupMatches(@$"<div style=""{STYLE}{style}"" class=""bit-stc"" id:ignore></div>");
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButton/BitButton.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButton/BitButton.razor.cs
index cc5052f88e..31afdd39fd 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButton/BitButton.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButton/BitButton.razor.cs
@@ -58,6 +58,12 @@ public partial class BitButton : BitComponentBase
     [Parameter, ResetClassBuilder]
     public BitColor? Color { get; set; }
 
+    /// <summary>
+    /// Preserves the foreground color of the button through hover and focus.
+    /// </summary>
+    [Parameter, ResetClassBuilder]
+    public bool FixedColor { get; set; }
+
     /// <summary>
     /// The value of the href attribute of the link rendered by the button. If provided, the component will be rendered as an anchor tag instead of button.
     /// </summary>
@@ -203,6 +209,8 @@ protected override void RegisterCssClasses()
         });
 
         ClassBuilder.Register(() => ReversedIcon ? "bit-btn-rvi" : string.Empty);
+
+        ClassBuilder.Register(() => FixedColor ? "bit-btn-ftc" : string.Empty);
     }
 
     protected override void RegisterCssStyles()
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButton/BitButton.scss b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButton/BitButton.scss
index b7a9d66530..677347da00 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButton/BitButton.scss
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButton/BitButton.scss
@@ -151,6 +151,10 @@
     }
 }
 
+.bit-btn-ftc {
+    color: var(--bit-btn-clr-txt);
+}
+
 
 .bit-btn-pri {
     --bit-btn-clr: #{$clr-pri};
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Layouts/Stack/BitStack.cs b/src/BlazorUI/Bit.BlazorUI/Components/Layouts/Stack/BitStack.cs
index 31ea6a11e4..e322c3b4f8 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Layouts/Stack/BitStack.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Layouts/Stack/BitStack.cs
@@ -4,6 +4,24 @@ namespace Bit.BlazorUI;
 
 public partial class BitStack : BitComponentBase
 {
+    /// <summary>
+    /// Make the height of the stack auto.
+    /// </summary>
+    [Parameter, ResetStyleBuilder]
+    public bool AutoHeight { get; set; }
+
+    /// <summary>
+    /// Make the width and height of the stack auto.
+    /// </summary>
+    [Parameter, ResetStyleBuilder]
+    public bool AutoSize { get; set; }
+
+    /// <summary>
+    /// Make the width of the stack auto.
+    /// </summary>
+    [Parameter, ResetStyleBuilder]
+    public bool AutoWidth { get; set; }
+
     /// <summary>
     /// The content of the stack.
     /// </summary>
@@ -42,25 +60,7 @@ public partial class BitStack : BitComponentBase
     /// Defines whether to render Stack children horizontally.
     /// </summary>
     [Parameter, ResetStyleBuilder]
-    public BitAlignment HorizontalAlign { get; set; }
-
-    /// <summary>
-    /// Make the width and height of the stack 100%.
-    /// </summary>
-    [Parameter, ResetStyleBuilder]
-    public bool Full { get; set; }
-
-    /// <summary>
-    /// Make the height of the stack 100%.
-    /// </summary>
-    [Parameter, ResetStyleBuilder]
-    public bool FullHeight { get; set; }
-
-    /// <summary>
-    /// Make the width of the stack 100%.
-    /// </summary>
-    [Parameter, ResetStyleBuilder]
-    public bool FullWidth { get; set; }
+    public BitAlignment? HorizontalAlign { get; set; }
 
     /// <summary>
     /// Defines whether to render Stack children in the opposite direction (bottom-to-top if it's a vertical Stack and right-to-left if it's a horizontal Stack).
@@ -72,7 +72,7 @@ public partial class BitStack : BitComponentBase
     /// Defines whether to render Stack children vertically.
     /// </summary>
     [Parameter, ResetStyleBuilder]
-    public BitAlignment VerticalAlign { get; set; }
+    public BitAlignment? VerticalAlign { get; set; }
 
     /// <summary>
     /// Defines whether Stack children should wrap onto multiple rows or columns when they are about to overflow the size of the Stack.
@@ -88,18 +88,24 @@ protected override void RegisterCssStyles()
     {
         StyleBuilder.Register(() => $"flex-direction:{(Horizontal ? "row" : "column")}{(Reversed ? "-reverse" : string.Empty)}");
 
-        StyleBuilder.Register(() => $"align-items:{_AlignmentMap[Horizontal ? VerticalAlign : HorizontalAlign]}");
+        StyleBuilder.Register(() => $"gap:{Gap ?? "1rem"}");
 
-        StyleBuilder.Register(() => $"justify-content:{_AlignmentMap[Horizontal ? HorizontalAlign : VerticalAlign]}");
+        StyleBuilder.Register(() =>
+            (Horizontal && VerticalAlign is not null) || (Horizontal is false && HorizontalAlign is not null)
+                ? $"align-items:{_AlignmentMap[Horizontal ? VerticalAlign!.Value : HorizontalAlign!.Value]}"
+                : string.Empty);
 
-        StyleBuilder.Register(() => Gap.HasValue() ? $"gap:{Gap}" : string.Empty);
+        StyleBuilder.Register(() =>
+            (Horizontal && HorizontalAlign is not null) || (Horizontal is false && VerticalAlign is not null)
+                ? $"justify-content:{_AlignmentMap[Horizontal ? HorizontalAlign!.Value : VerticalAlign!.Value]}"
+                : string.Empty);
 
         StyleBuilder.Register(() => (Grow.HasValue() || Grows) ? $"flex-grow:{(Grow.HasValue() ? Grow : "1")}" : string.Empty);
 
         StyleBuilder.Register(() => Wrap ? "flex-wrap:wrap" : string.Empty);
 
-        StyleBuilder.Register(() => (Full || FullWidth) ? "width:100%" : string.Empty);
-        StyleBuilder.Register(() => (Full || FullHeight) ? "height:100%" : string.Empty);
+        StyleBuilder.Register(() => (AutoSize || AutoWidth) ? "width:auto" : string.Empty);
+        StyleBuilder.Register(() => (AutoSize || AutoHeight) ? "height:auto" : string.Empty);
     }
 
     protected override void BuildRenderTree(RenderTreeBuilder builder)
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Layouts/Stack/BitStack.scss b/src/BlazorUI/Bit.BlazorUI/Components/Layouts/Stack/BitStack.scss
index 5e63ec8445..33fc89e0e3 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Layouts/Stack/BitStack.scss
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Layouts/Stack/BitStack.scss
@@ -1,10 +1,10 @@
 @import "../../../Styles/functions.scss";
 
 .bit-stc {
-    width: auto;
-    height: auto;
+    width: 100%;
+    height: 100%;
     display: flex;
+    align-items: center;
     box-sizing: border-box;
-    align-items: flex-start;
-    justify-content: flex-start;
+    justify-content: center;
 }
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitButtonDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitButtonDemo.razor.cs
index 0e76e75803..3b8b054bd2 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitButtonDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitButtonDemo.razor.cs
@@ -67,6 +67,13 @@ public partial class BitButtonDemo
             Href = "#color-enum",
         },
         new()
+        {
+            Name = "FixedColor",
+            Type = "bool",
+            DefaultValue = "false",
+            Description = "Preserves the foreground color of the button through hover and focus.",
+        },
+        new()
         {
             Name = "Href",
             Type = "string?",
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Layouts/Stack/BitStackDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Layouts/Stack/BitStackDemo.razor
index d4c7868232..3a1fb48261 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Layouts/Stack/BitStackDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Layouts/Stack/BitStackDemo.razor
@@ -148,19 +148,19 @@
 
                 <BitStack Gap="0.5rem" Style="background:#71afe5;height:15rem">
                     <BitStack Grow="3"
-                              Class="item" Style="width:100%"
+                              Class="item" AutoHeight
                               VerticalAlign="BitAlignment.Center"
                               HorizontalAlign="BitAlignment.Center">
                         Grow is 3
                     </BitStack>
                     <BitStack Grow="2"
-                              Class="item" Style="width:100%"
+                              Class="item" AutoHeight
                               VerticalAlign="BitAlignment.Center"
                               HorizontalAlign="BitAlignment.Center">
                         Grow is 2
                     </BitStack>
                     <BitStack Grow="1"
-                              Class="item" Style="width:100%"
+                              Class="item" AutoHeight
                               VerticalAlign="BitAlignment.Center"
                               HorizontalAlign="BitAlignment.Center">
                         Grow is 1
@@ -170,18 +170,18 @@
                 <br /><br />
 
                 <BitStack Gap="0.5rem" Style="background:#71afe5;height:15rem">
-                    <BitStack Class="item" Style="width:100%"
+                    <BitStack Class="item" AutoHeight
                               VerticalAlign="BitAlignment.Center"
                               HorizontalAlign="BitAlignment.Center">
                         Normal
                     </BitStack>
                     <BitStack Grows
-                               Class="item" Style="width:100%"
+                               Class="item" AutoHeight
                                VerticalAlign="BitAlignment.Center"
                                HorizontalAlign="BitAlignment.Center">
                          Grows
                      </BitStack>
-                     <BitStack Class="item" Style="width:100%"
+                     <BitStack Class="item" AutoHeight
                                VerticalAlign="BitAlignment.Center"
                                HorizontalAlign="BitAlignment.Center">
                          Normal
@@ -193,18 +193,18 @@
                  <BitStack Horizontal
                            Gap="0.5rem"
                            Style="background:#71afe5;height:15rem">
-                     <BitStack Class="item" Style="height:100%"
+                     <BitStack Class="item" AutoWidth
                                VerticalAlign="BitAlignment.Center"
                                HorizontalAlign="BitAlignment.Center">
                          Normal
                      </BitStack>
                      <BitStack Grows
-                               Class="item" Style="height:100%"
+                               Class="item" AutoWidth
                                VerticalAlign="BitAlignment.Center"
                                HorizontalAlign="BitAlignment.Center">
                          Grows
                      </BitStack>
-                     <BitStack Class="item" Style="height:100%"
+                     <BitStack Class="item" AutoWidth
                                VerticalAlign="BitAlignment.Center"
                                HorizontalAlign="BitAlignment.Center">
                          Normal
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Layouts/Stack/BitStackDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Layouts/Stack/BitStackDemo.razor.cs
index d1cd9e03e3..a525ddaee8 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Layouts/Stack/BitStackDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Layouts/Stack/BitStackDemo.razor.cs
@@ -3,6 +3,27 @@ public partial class BitStackDemo
 {
     private readonly List<ComponentParameter> componentParameters =
     [
+        new()
+        {
+            Name = "AutoHeight",
+            Type = "bool",
+            DefaultValue = "false",
+            Description = "Make the height of the stack auto."
+        },
+        new()
+        {
+            Name = "AutoSize",
+            Type = "bool",
+            DefaultValue = "false",
+            Description = "Make the width and height of the stack auto."
+        },
+        new()
+        {
+            Name = "AutoWidth",
+            Type = "bool",
+            DefaultValue = "false",
+            Description = "Make the width of the stack auto."
+        },
         new()
         {
             Name = "ChildContent",
@@ -48,32 +69,11 @@ public partial class BitStackDemo
         new()
         {
             Name = "HorizontalAlign",
-            Type = "BitAlignment",
-            DefaultValue = "BitAlignment.Start",
+            Type = "BitAlignment?",
+            DefaultValue = "null",
             Description = "Defines whether to render Stack children horizontally.",
+            LinkType = LinkType.Link,
             Href = "#alignment-enum",
-            LinkType = LinkType.Link
-        },
-        new()
-        {
-            Name = "Full",
-            Type = "bool",
-            DefaultValue = "false",
-            Description = "Make the width and height of the stack 100%."
-        },
-        new()
-        {
-            Name = "FullHeight",
-            Type = "bool",
-            DefaultValue = "false",
-            Description = "Make the height of the stack 100%."
-        },
-        new()
-        {
-            Name = "FullWidth",
-            Type = "bool",
-            DefaultValue = "false",
-            Description = "Make the width of the stack 100%."
         },
         new()
         {
@@ -85,11 +85,11 @@ public partial class BitStackDemo
         new()
         {
             Name = "VerticalAlign",
-            Type = "BitAlignment",
-            DefaultValue = "BitAlignment.Start",
+            Type = "BitAlignment?",
+            DefaultValue = "null",
             Description = "Defines whether to render Stack children vertically.",
+            LinkType = LinkType.Link,
             Href = "#alignment-enum",
-            LinkType = LinkType.Link
         },
         new()
         {
@@ -331,19 +331,19 @@ public partial class BitStackDemo
     private readonly string example6RazorCode = @"
 <BitStack Gap=""0.5rem"" Style=""background:#71afe5;height:15rem"">
     <BitStack Grow=""3""
-              Class=""item"" Style=""width:100%""
+              Class=""item"" AutoHeight
               VerticalAlign=""BitAlignment.Center""
               HorizontalAlign=""BitAlignment.Center"">
         Grow is 3
     </BitStack>
     <BitStack Grow=""2""
-              Class=""item"" Style=""width:100%""
+              Class=""item"" AutoHeight
               VerticalAlign=""BitAlignment.Center""
               HorizontalAlign=""BitAlignment.Center"">
         Grow is 2
     </BitStack>
     <BitStack Grow=""1""
-              Class=""item"" Style=""width:100%""
+              Class=""item"" AutoHeight
               VerticalAlign=""BitAlignment.Center""
               HorizontalAlign=""BitAlignment.Center"">
         Grow is 1
@@ -353,18 +353,18 @@ Grow is 1
 <br /><br />
 
 <BitStack Gap=""0.5rem"" Style=""background:#71afe5;height:15rem"">
-    <BitStack Class=""item"" Style=""width:100%""
+    <BitStack Class=""item"" AutoHeight
               VerticalAlign=""BitAlignment.Center""
               HorizontalAlign=""BitAlignment.Center"">
         Normal
     </BitStack>
     <BitStack Grows
-              Class=""item"" Style=""width:100%""
+              Class=""item"" AutoHeight
               VerticalAlign=""BitAlignment.Center""
               HorizontalAlign=""BitAlignment.Center"">
         Grows
     </BitStack>
-    <BitStack Class=""item"" Style=""width:100%""
+    <BitStack Class=""item"" AutoHeight
               VerticalAlign=""BitAlignment.Center""
               HorizontalAlign=""BitAlignment.Center"">
         Normal
@@ -376,18 +376,18 @@ Grow is 1
 <BitStack Horizontal
           Gap=""0.5rem""
           Style=""background:#71afe5;height:15rem"">
-    <BitStack Class=""item"" Style=""height:100%""
+    <BitStack Class=""item"" AutoWidth
               VerticalAlign=""BitAlignment.Center""
               HorizontalAlign=""BitAlignment.Center"">
         Normal
     </BitStack>
     <BitStack Grows
-              Class=""item"" Style=""height:100%""
+              Class=""item"" AutoWidth
               VerticalAlign=""BitAlignment.Center""
               HorizontalAlign=""BitAlignment.Center"">
         Grows
     </BitStack>
-    <BitStack Class=""item"" Style=""height:100%""
+    <BitStack Class=""item"" AutoWidth
               VerticalAlign=""BitAlignment.Center""
               HorizontalAlign=""BitAlignment.Center"">
         Normal