diff --git a/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavBarTagHelper.cs b/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavBarTagHelper.cs
index 1c90090de0..a4720b8d0f 100644
--- a/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavBarTagHelper.cs
+++ b/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavBarTagHelper.cs
@@ -4,6 +4,8 @@
     {
         public AbpNavbarSize Size { get; set; } = AbpNavbarSize.Default;
 
+        public AbpNavbarStyle NavbarStyle { get; set; } = AbpNavbarStyle.Default;
+
         public AbpNavBarTagHelper(AbpNavBarTagHelperService tagHelperService)
             : base(tagHelperService)
         {
diff --git a/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavBarTagHelperService.cs b/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavBarTagHelperService.cs
index 2c9a429fb2..94dc533884 100644
--- a/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavBarTagHelperService.cs
+++ b/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavBarTagHelperService.cs
@@ -9,10 +9,9 @@ namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Nav
         {
             output.TagName = "nav";
             output.Attributes.AddClass("navbar");
-            output.Attributes.AddClass("bg-light");
-            output.Attributes.AddClass("navbar-light");
 
             SetSize(context,output);
+            SetStyle(context, output);
         }
 
         protected virtual void SetSize(TagHelperContext context, TagHelperOutput output)
@@ -22,5 +21,25 @@ namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Nav
                 output.Attributes.AddClass("navbar-expand-" + TagHelper.Size.ToString().ToLowerInvariant());
             }
         }
+
+        protected virtual void SetStyle(TagHelperContext context, TagHelperOutput output)
+        {
+            if (TagHelper.NavbarStyle == AbpNavbarStyle.Default)
+            {
+                return;
+            }
+
+            var styleAsStringArray = TagHelper.NavbarStyle.ToString().ToLowerInvariant().Split('_');
+
+            if (styleAsStringArray.Length < 2)
+            {
+                output.Attributes.AddClass("navbar-" + styleAsStringArray[0]);
+            }
+            else
+            {
+                output.Attributes.AddClass("navbar-" + styleAsStringArray[0]);
+                output.Attributes.AddClass("bg-" + styleAsStringArray[1]);
+            }
+        }
     }
 }
\ No newline at end of file
diff --git a/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavbarStyle.cs b/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavbarStyle.cs
new file mode 100644
index 0000000000..c70e21e694
--- /dev/null
+++ b/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavbarStyle.cs
@@ -0,0 +1,27 @@
+namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Nav
+{
+    public enum AbpNavbarStyle
+    {
+        Default,
+        Dark,
+        Light,
+        Dark_Primary,
+        Dark_Secondary,
+        Dark_Success,
+        Dark_Danger,
+        Dark_Warning,
+        Dark_Info,
+        Dark_Light,
+        Dark_Dark,
+        Dark_Link,
+        Light_Primary,
+        Light_Secondary,
+        Light_Success,
+        Light_Danger,
+        Light_Warning,
+        Light_Info,
+        Light_Light,
+        Light_Dark,
+        Light_Link
+    }
+}
\ No newline at end of file
diff --git a/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavbarTextTagHelper.cs b/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavbarTextTagHelper.cs
new file mode 100644
index 0000000000..f3381b728a
--- /dev/null
+++ b/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavbarTextTagHelper.cs
@@ -0,0 +1,14 @@
+using Microsoft.AspNetCore.Razor.TagHelpers;
+
+namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Nav
+{
+    [HtmlTargetElement("span", Attributes = "abp-navbar-text")]
+    public class AbpNavbarTextTagHelper : AbpTagHelper<AbpNavbarTextTagHelper, AbpNavbarTextTagHelperService>
+    {
+        public AbpNavbarTextTagHelper(AbpNavbarTextTagHelperService tagHelperService)
+            : base(tagHelperService)
+        {
+
+        }
+    }
+}
diff --git a/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavbarTextTagHelperService.cs b/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavbarTextTagHelperService.cs
new file mode 100644
index 0000000000..a05ad95471
--- /dev/null
+++ b/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavbarTextTagHelperService.cs
@@ -0,0 +1,14 @@
+using Microsoft.AspNetCore.Razor.TagHelpers;
+using Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.Microsoft.AspNetCore.Razor.TagHelpers;
+
+namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Nav
+{
+    public class AbpNavbarTextTagHelperService : AbpTagHelperService<AbpNavbarTextTagHelper>
+    {
+        public override void Process(TagHelperContext context, TagHelperOutput output)
+        {
+            output.Attributes.AddClass("navbar-text");
+            output.Attributes.RemoveAll("abp-navbar-text");
+        }
+    }
+}
\ No newline at end of file
diff --git a/test/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.Demo/Pages/Components/Navs.cshtml b/test/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.Demo/Pages/Components/Navs.cshtml
index d6e4b06fe3..ab9f87b2a6 100644
--- a/test/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.Demo/Pages/Components/Navs.cshtml
+++ b/test/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.Demo/Pages/Components/Navs.cshtml
@@ -54,7 +54,7 @@
 <div class="demo-with-code">
     <div class="demo-area">
 
-        <abp-nav-bar size="Lg">
+        <abp-nav-bar size="Lg" navbar-style="Dark_Warning">
             <a abp-navbar-brand href="#">Navbar</a>
             <abp-navbar-toggle>
                 <abp-navbar-nav>
@@ -82,12 +82,17 @@
                     </abp-nav-item>
                 </abp-navbar-nav>
             </abp-navbar-toggle>
+            
+            <span abp-navbar-text>
+                 Sample Text
+            </span>
+
         </abp-nav-bar>
 
     </div>
     <div class="code-area">
         <pre>
-        &lt;abp-nav-bar size=&quot;Lg&quot;&gt;
+        &lt;abp-nav-bar size=&quot;Lg&quot; navbar-style=&quot;Dark_Warning&quot;&gt;
             &lt;a abp-navbar-brand href=&quot;#&quot;&gt;Navbar&lt;/a&gt;
             &lt;abp-navbar-toggle&gt;
                 &lt;abp-navbar-nav&gt;
@@ -115,6 +120,11 @@
                     &lt;/abp-nav-item&gt;
                 &lt;/abp-navbar-nav&gt;
             &lt;/abp-navbar-toggle&gt;
+            
+            &lt;span abp-navbar-text&gt;
+                 Sample Text
+            &lt;/span&gt;
+
         &lt;/abp-nav-bar&gt;
 </pre>
     </div>