diff --git a/apps/client/src/app/components/admin-market-data/admin-market-data.component.ts b/apps/client/src/app/components/admin-market-data/admin-market-data.component.ts
index 7fca190bc..805adf89d 100644
--- a/apps/client/src/app/components/admin-market-data/admin-market-data.component.ts
+++ b/apps/client/src/app/components/admin-market-data/admin-market-data.component.ts
@@ -18,8 +18,8 @@ import { AdminMarketDataItem } from '@ghostfolio/common/interfaces/admin-market-
 import { hasPermission, permissions } from '@ghostfolio/common/permissions';
 import { GfSymbolPipe } from '@ghostfolio/common/pipes';
 import { GfActivitiesFilterComponent } from '@ghostfolio/ui/activities-filter';
+import { GfFabComponent } from '@ghostfolio/ui/fab';
 import { translate } from '@ghostfolio/ui/i18n';
-import { GfPageFabComponent } from '@ghostfolio/ui/page-fab';
 import { GfPremiumIndicatorComponent } from '@ghostfolio/ui/premium-indicator';
 import { AdminService, DataService } from '@ghostfolio/ui/services';
 import { GfValueComponent } from '@ghostfolio/ui/value';
@@ -84,7 +84,7 @@ import { CreateAssetProfileDialogParams } from './create-asset-profile-dialog/in
   imports: [
     CommonModule,
     GfActivitiesFilterComponent,
-    GfPageFabComponent,
+    GfFabComponent,
     GfPremiumIndicatorComponent,
     GfSymbolPipe,
     GfValueComponent,
diff --git a/apps/client/src/app/components/admin-market-data/admin-market-data.html b/apps/client/src/app/components/admin-market-data/admin-market-data.html
index b69ebbda5..63d425513 100644
--- a/apps/client/src/app/components/admin-market-data/admin-market-data.html
+++ b/apps/client/src/app/components/admin-market-data/admin-market-data.html
@@ -332,15 +332,5 @@
     </div>
   </div>
 
-  <gf-page-fab>
-    <a
-      class="align-items-center d-flex justify-content-center"
-      color="primary"
-      mat-fab
-      [queryParams]="{ createAssetProfileDialog: true }"
-      [routerLink]="[]"
-    >
-      <ion-icon name="add-outline" size="large" />
-    </a>
-  </gf-page-fab>
+  <gf-fab [queryParams]="{ createAssetProfileDialog: true }" />
 </div>
diff --git a/apps/client/src/app/components/home-watchlist/home-watchlist.component.ts b/apps/client/src/app/components/home-watchlist/home-watchlist.component.ts
index 2913ce637..7fb951ff5 100644
--- a/apps/client/src/app/components/home-watchlist/home-watchlist.component.ts
+++ b/apps/client/src/app/components/home-watchlist/home-watchlist.component.ts
@@ -8,7 +8,7 @@ import {
 } from '@ghostfolio/common/interfaces';
 import { hasPermission, permissions } from '@ghostfolio/common/permissions';
 import { GfBenchmarkComponent } from '@ghostfolio/ui/benchmark';
-import { GfPageFabComponent } from '@ghostfolio/ui/page-fab';
+import { GfFabComponent } from '@ghostfolio/ui/fab';
 import { GfPremiumIndicatorComponent } from '@ghostfolio/ui/premium-indicator';
 import { DataService } from '@ghostfolio/ui/services';
 
@@ -38,7 +38,7 @@ import { CreateWatchlistItemDialogParams } from './create-watchlist-item-dialog/
   changeDetection: ChangeDetectionStrategy.OnPush,
   imports: [
     GfBenchmarkComponent,
-    GfPageFabComponent,
+    GfFabComponent,
     GfPremiumIndicatorComponent,
     IonIcon,
     MatButtonModule,
diff --git a/apps/client/src/app/components/home-watchlist/home-watchlist.html b/apps/client/src/app/components/home-watchlist/home-watchlist.html
index e1242736e..e2865b9cf 100644
--- a/apps/client/src/app/components/home-watchlist/home-watchlist.html
+++ b/apps/client/src/app/components/home-watchlist/home-watchlist.html
@@ -22,15 +22,5 @@
   </div>
 </div>
 @if (!hasImpersonationId && hasPermissionToCreateWatchlistItem) {
-  <gf-page-fab>
-    <a
-      class="align-items-center d-flex justify-content-center"
-      color="primary"
-      mat-fab
-      [queryParams]="{ createWatchlistItemDialog: true }"
-      [routerLink]="[]"
-    >
-      <ion-icon name="add-outline" size="large" />
-    </a>
-  </gf-page-fab>
+  <gf-fab [queryParams]="{ createWatchlistItemDialog: true }" />
 }
diff --git a/apps/client/src/app/components/user-account-access/user-account-access.component.ts b/apps/client/src/app/components/user-account-access/user-account-access.component.ts
index aebdecc0e..eef50cee3 100644
--- a/apps/client/src/app/components/user-account-access/user-account-access.component.ts
+++ b/apps/client/src/app/components/user-account-access/user-account-access.component.ts
@@ -4,8 +4,8 @@ import { CreateAccessDto } from '@ghostfolio/common/dtos';
 import { ConfirmationDialogType } from '@ghostfolio/common/enums';
 import { Access, User } from '@ghostfolio/common/interfaces';
 import { hasPermission, permissions } from '@ghostfolio/common/permissions';
+import { GfFabComponent } from '@ghostfolio/ui/fab';
 import { NotificationService } from '@ghostfolio/ui/notifications';
-import { GfPageFabComponent } from '@ghostfolio/ui/page-fab';
 import { GfPremiumIndicatorComponent } from '@ghostfolio/ui/premium-indicator';
 import { DataService } from '@ghostfolio/ui/services';
 
@@ -45,7 +45,7 @@ import { CreateOrUpdateAccessDialogParams } from './create-or-update-access-dial
   changeDetection: ChangeDetectionStrategy.OnPush,
   imports: [
     GfAccessTableComponent,
-    GfPageFabComponent,
+    GfFabComponent,
     GfPremiumIndicatorComponent,
     IonIcon,
     MatButtonModule,
diff --git a/apps/client/src/app/components/user-account-access/user-account-access.html b/apps/client/src/app/components/user-account-access/user-account-access.html
index c53807b35..62b1648bb 100644
--- a/apps/client/src/app/components/user-account-access/user-account-access.html
+++ b/apps/client/src/app/components/user-account-access/user-account-access.html
@@ -69,16 +69,6 @@
     (accessToUpdate)="onUpdateAccess($event)"
   />
   @if (hasPermissionToCreateAccess) {
-    <gf-page-fab>
-      <a
-        class="align-items-center d-flex justify-content-center"
-        color="primary"
-        mat-fab
-        [queryParams]="{ createDialog: true }"
-        [routerLink]="[]"
-      >
-        <ion-icon name="add-outline" size="large" />
-      </a>
-    </gf-page-fab>
+    <gf-fab [queryParams]="{ createDialog: true }" />
   }
 </div>
diff --git a/apps/client/src/app/pages/accounts/accounts-page.component.ts b/apps/client/src/app/pages/accounts/accounts-page.component.ts
index 59821901a..a02a88592 100644
--- a/apps/client/src/app/pages/accounts/accounts-page.component.ts
+++ b/apps/client/src/app/pages/accounts/accounts-page.component.ts
@@ -10,8 +10,8 @@ import {
 import { User } from '@ghostfolio/common/interfaces';
 import { hasPermission, permissions } from '@ghostfolio/common/permissions';
 import { GfAccountsTableComponent } from '@ghostfolio/ui/accounts-table';
+import { GfFabComponent } from '@ghostfolio/ui/fab';
 import { NotificationService } from '@ghostfolio/ui/notifications';
-import { GfPageFabComponent } from '@ghostfolio/ui/page-fab';
 import { DataService } from '@ghostfolio/ui/services';
 
 import {
@@ -40,7 +40,7 @@ import { GfTransferBalanceDialogComponent } from './transfer-balance/transfer-ba
   host: { class: 'page' },
   imports: [
     GfAccountsTableComponent,
-    GfPageFabComponent,
+    GfFabComponent,
     MatButtonModule,
     RouterModule
   ],
diff --git a/apps/client/src/app/pages/accounts/accounts-page.html b/apps/client/src/app/pages/accounts/accounts-page.html
index 65b93fa20..1bdedbbb9 100644
--- a/apps/client/src/app/pages/accounts/accounts-page.html
+++ b/apps/client/src/app/pages/accounts/accounts-page.html
@@ -26,16 +26,6 @@
     hasPermissionToCreateAccount &&
     !user.settings.isRestrictedView
   ) {
-    <gf-page-fab>
-      <a
-        class="align-items-center d-flex justify-content-center"
-        color="primary"
-        mat-fab
-        [queryParams]="{ createDialog: true }"
-        [routerLink]="[]"
-      >
-        <ion-icon name="add-outline" size="large" />
-      </a>
-    </gf-page-fab>
+    <gf-fab [queryParams]="{ createDialog: true }" />
   }
 </div>
diff --git a/apps/client/src/app/pages/portfolio/activities/activities-page.component.ts b/apps/client/src/app/pages/portfolio/activities/activities-page.component.ts
index 7face7763..f2a298500 100644
--- a/apps/client/src/app/pages/portfolio/activities/activities-page.component.ts
+++ b/apps/client/src/app/pages/portfolio/activities/activities-page.component.ts
@@ -12,7 +12,7 @@ import {
 import { hasPermission, permissions } from '@ghostfolio/common/permissions';
 import { DateRange } from '@ghostfolio/common/types';
 import { GfActivitiesTableComponent } from '@ghostfolio/ui/activities-table';
-import { GfPageFabComponent } from '@ghostfolio/ui/page-fab';
+import { GfFabComponent } from '@ghostfolio/ui/fab';
 import { DataService } from '@ghostfolio/ui/services';
 
 import {
@@ -44,7 +44,7 @@ import { ImportActivitiesDialogParams } from './import-activities-dialog/interfa
 @Component({
   imports: [
     GfActivitiesTableComponent,
-    GfPageFabComponent,
+    GfFabComponent,
     IonIcon,
     MatButtonModule,
     MatSnackBarModule,
diff --git a/apps/client/src/app/pages/portfolio/activities/activities-page.html b/apps/client/src/app/pages/portfolio/activities/activities-page.html
index 7c499e681..f06947988 100644
--- a/apps/client/src/app/pages/portfolio/activities/activities-page.html
+++ b/apps/client/src/app/pages/portfolio/activities/activities-page.html
@@ -43,16 +43,6 @@
     hasPermissionToCreateActivity &&
     !user.settings.isRestrictedView
   ) {
-    <gf-page-fab>
-      <a
-        class="align-items-center d-flex justify-content-center"
-        color="primary"
-        mat-fab
-        [queryParams]="{ createDialog: true }"
-        [routerLink]="[]"
-      >
-        <ion-icon name="add-outline" size="large" />
-      </a>
-    </gf-page-fab>
+    <gf-fab [queryParams]="{ createDialog: true }" />
   }
 </div>
diff --git a/libs/ui/src/lib/fab/fab.component.html b/libs/ui/src/lib/fab/fab.component.html
new file mode 100644
index 000000000..8fb49de1c
--- /dev/null
+++ b/libs/ui/src/lib/fab/fab.component.html
@@ -0,0 +1,9 @@
+<a
+  class="align-items-center d-flex justify-content-center"
+  color="primary"
+  mat-fab
+  [queryParams]="queryParams()"
+  [routerLink]="[]"
+>
+  <ion-icon size="large" [name]="icon()" />
+</a>
diff --git a/libs/ui/src/lib/page-fab/page-fab.component.scss b/libs/ui/src/lib/fab/fab.component.scss
similarity index 100%
rename from libs/ui/src/lib/page-fab/page-fab.component.scss
rename to libs/ui/src/lib/fab/fab.component.scss
diff --git a/libs/ui/src/lib/fab/fab.component.ts b/libs/ui/src/lib/fab/fab.component.ts
new file mode 100644
index 000000000..7a4a4c169
--- /dev/null
+++ b/libs/ui/src/lib/fab/fab.component.ts
@@ -0,0 +1,16 @@
+import { ChangeDetectionStrategy, Component, input } from '@angular/core';
+import { MatButtonModule } from '@angular/material/button';
+import { Params, RouterModule } from '@angular/router';
+import { IonIcon } from '@ionic/angular/standalone';
+
+@Component({
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  imports: [IonIcon, MatButtonModule, RouterModule],
+  selector: 'gf-fab',
+  styleUrls: ['./fab.component.scss'],
+  templateUrl: './fab.component.html'
+})
+export class GfFabComponent {
+  public readonly icon = input('add-outline');
+  public readonly queryParams = input.required<Params>();
+}
diff --git a/libs/ui/src/lib/fab/index.ts b/libs/ui/src/lib/fab/index.ts
new file mode 100644
index 000000000..d03295245
--- /dev/null
+++ b/libs/ui/src/lib/fab/index.ts
@@ -0,0 +1 @@
+export * from './fab.component';
diff --git a/libs/ui/src/lib/page-fab/index.ts b/libs/ui/src/lib/page-fab/index.ts
deleted file mode 100644
index 0981acbf8..000000000
--- a/libs/ui/src/lib/page-fab/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './page-fab.component';
diff --git a/libs/ui/src/lib/page-fab/page-fab.component.html b/libs/ui/src/lib/page-fab/page-fab.component.html
deleted file mode 100644
index 40b372640..000000000
--- a/libs/ui/src/lib/page-fab/page-fab.component.html
+++ /dev/null
@@ -1 +0,0 @@
-<ng-content />
diff --git a/libs/ui/src/lib/page-fab/page-fab.component.ts b/libs/ui/src/lib/page-fab/page-fab.component.ts
deleted file mode 100644
index f716388c1..000000000
--- a/libs/ui/src/lib/page-fab/page-fab.component.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import { ChangeDetectionStrategy, Component } from '@angular/core';
-
-@Component({
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  selector: 'gf-page-fab',
-  styleUrls: ['./page-fab.component.scss'],
-  templateUrl: './page-fab.component.html'
-})
-export class GfPageFabComponent {}