diff --git a/modules/identity/src/Volo.Abp.Identity.Web/AbpIdentityWebModule.cs b/modules/identity/src/Volo.Abp.Identity.Web/AbpIdentityWebModule.cs
index cc29ee26dd..511455bab3 100644
--- a/modules/identity/src/Volo.Abp.Identity.Web/AbpIdentityWebModule.cs
+++ b/modules/identity/src/Volo.Abp.Identity.Web/AbpIdentityWebModule.cs
@@ -81,6 +81,18 @@ namespace Volo.Abp.Identity.Web
                         );
                     }
                 );
+                
+                options.Configure<Volo.Abp.Identity.Web.Pages.Identity.Roles.IndexModel>(
+                    toolbar =>
+                    {
+                        toolbar.AddButton(
+                            LocalizableString.Create<IdentityResource>("NewRole"),
+                            icon: "plus",
+                            name: "CreateRole",
+                            requiredPolicyName: IdentityPermissions.Roles.Create
+                        );
+                    }
+                );
             });
         }
 
diff --git a/modules/identity/src/Volo.Abp.Identity.Web/Pages/Identity/Roles/Index.cshtml b/modules/identity/src/Volo.Abp.Identity.Web/Pages/Identity/Roles/Index.cshtml
index 734fc40fe5..30e42694e6 100644
--- a/modules/identity/src/Volo.Abp.Identity.Web/Pages/Identity/Roles/Index.cshtml
+++ b/modules/identity/src/Volo.Abp.Identity.Web/Pages/Identity/Roles/Index.cshtml
@@ -2,6 +2,7 @@
 @using Microsoft.AspNetCore.Authorization
 @using Microsoft.AspNetCore.Mvc.Localization
 @using Volo.Abp.AspNetCore.Mvc.UI.Layout
+@using Volo.Abp.AspNetCore.Mvc.UI.Theme.Shared.Pages.Shared.Components.AbpPageToolbar
 @using Volo.Abp.Identity
 @using Volo.Abp.Identity.Localization
 @using Volo.Abp.Identity.Web.Navigation
@@ -33,10 +34,7 @@
                 <abp-card-title>@L["Roles"]</abp-card-title>
             </abp-column>
             <abp-column size-md="_6" class="text-right">
-                @if (await Authorization.IsGrantedAsync(IdentityPermissions.Roles.Create))
-                {
-                    <abp-button button-type="Primary" name="CreateRole" text="@L["NewRole"].Value" icon="plus" />
-                }
+                @await Component.InvokeAsync(typeof(AbpPageToolbarViewComponent), new { pageName = typeof(IndexModel).FullName })
             </abp-column>
         </abp-row>
     </abp-card-header>