diff --git a/apps/web/src/app/organizations/layouts/organization-layout.component.html b/apps/web/src/app/organizations/layouts/organization-layout.component.html
index 3834635e18..03f699325b 100644
--- a/apps/web/src/app/organizations/layouts/organization-layout.component.html
+++ b/apps/web/src/app/organizations/layouts/organization-layout.component.html
@@ -6,34 +6,27 @@
         class="my-auto pl-1"
         [activeOrganization]="organization"
       ></app-organization-switcher>
-      <ul class="nav nav-tabs">
-        <li class="nav-item">
-          <a class="nav-link" routerLink="vault" routerLinkActive="active">
-            <i class="bwi bwi-lock" aria-hidden="true"></i>
-            {{ "vault" | i18n }}
-          </a>
-        </li>
-        <li class="nav-item" *ngIf="showManageTab">
-          <a class="nav-link" [routerLink]="manageRoute" routerLinkActive="active">
-            <i class="bwi bwi-sliders" aria-hidden="true"></i>
-            {{ "manage" | i18n }}
-          </a>
-        </li>
-        <li class="nav-item" *ngIf="showToolsTab">
-          <a class="nav-link" [routerLink]="toolsRoute" routerLinkActive="active">
-            <i class="bwi bwi-wrench" aria-hidden="true"></i>
-            {{ "tools" | i18n }}
-          </a>
-        </li>
-        <li class="nav-item" *ngIf="showSettingsTab">
-          <a class="nav-link" routerLink="settings" routerLinkActive="active">
-            <i class="bwi bwi-cogs" aria-hidden="true"></i>
-            {{ "settings" | i18n }}
-          </a>
-        </li>
-      </ul>
+      <bit-tab-group class="tw-mb-[-1px]">
+        <bit-tab-item [route]="['vault']">{{ "vault" | i18n }}</bit-tab-item>
+        <bit-tab-item *ngIf="showMembersTab" [route]="['members']">{{
+          "members" | i18n
+        }}</bit-tab-item>
+        <bit-tab-item *ngIf="showGroupsTab" [route]="['groups']">{{
+          "groups" | i18n
+        }}</bit-tab-item>
+        <bit-tab-item *ngIf="showReportsTab" [route]="['reports']">{{
+          "reports" | i18n
+        }}</bit-tab-item>
+        <bit-tab-item *ngIf="showBillingTab" [route]="['billing']">{{
+          "billing" | i18n
+        }}</bit-tab-item>
+        <bit-tab-item *ngIf="showSettingsTab" [route]="['settings']">{{
+          "settings" | i18n
+        }}</bit-tab-item>
+      </bit-tab-group>
     </div>
   </div>
 </div>
+
 <router-outlet></router-outlet>
 <app-footer></app-footer>
diff --git a/apps/web/src/app/organizations/layouts/organization-layout.component.ts b/apps/web/src/app/organizations/layouts/organization-layout.component.ts
index 2657e70f0a..fc0275184a 100644
--- a/apps/web/src/app/organizations/layouts/organization-layout.component.ts
+++ b/apps/web/src/app/organizations/layouts/organization-layout.component.ts
@@ -62,6 +62,22 @@ export class OrganizationLayoutComponent implements OnInit, OnDestroy {
     return NavigationPermissionsService.canAccessSettings(this.organization);
   }
 
+  get showMembersTab(): boolean {
+    return this.organization.canManageUsers;
+  }
+
+  get showGroupsTab(): boolean {
+    return this.organization.canManageGroups;
+  }
+
+  get showReportsTab(): boolean {
+    return this.organization.canAccessReports;
+  }
+
+  get showBillingTab(): boolean {
+    return this.organization.canManageBilling;
+  }
+
   get toolsRoute(): string {
     return this.organization.canAccessImportExport
       ? "tools/import"
diff --git a/apps/web/src/locales/en/messages.json b/apps/web/src/locales/en/messages.json
index a00b34346b..e89d318a76 100644
--- a/apps/web/src/locales/en/messages.json
+++ b/apps/web/src/locales/en/messages.json
@@ -5210,5 +5210,8 @@
   },
   "on": {
     "message": "On"
+  },
+  "members": {
+    "message": "Members"
   }
 }