diff --git a/bitwarden_license/src/app/app.module.ts b/bitwarden_license/src/app/app.module.ts
index cd2c628c82a..204c6d5dee3 100644
--- a/bitwarden_license/src/app/app.module.ts
+++ b/bitwarden_license/src/app/app.module.ts
@@ -1,11 +1,11 @@
-import { ToasterModule } from 'angular2-toaster';
-import { InfiniteScrollModule } from 'ngx-infinite-scroll';
-
 import { DragDropModule } from '@angular/cdk/drag-drop';
 import { NgModule } from '@angular/core';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { RouterModule } from '@angular/router';
+import { InfiniteScrollModule } from 'ngx-infinite-scroll';
+
+import { BitwardenToastModule } from 'jslib-angular/components/toastr.component';
 
 import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
@@ -25,7 +25,11 @@ import { WildcardRoutingModule } from 'src/app/wildcard-routing.module';
         FormsModule,
         ReactiveFormsModule,
         ServicesModule,
-        ToasterModule.forRoot(),
+        BitwardenToastModule.forRoot({
+            maxOpened: 5,
+            autoDismiss: true,
+            closeButton: true,
+        }),
         InfiniteScrollModule,
         DragDropModule,
         AppRoutingModule,
diff --git a/bitwarden_license/src/app/providers/clients/add-organization.component.ts b/bitwarden_license/src/app/providers/clients/add-organization.component.ts
index 099d4d04f71..ef343b2a6b3 100644
--- a/bitwarden_license/src/app/providers/clients/add-organization.component.ts
+++ b/bitwarden_license/src/app/providers/clients/add-organization.component.ts
@@ -5,9 +5,7 @@ import {
     OnInit,
     Output
 } from '@angular/core';
-import { ToasterService } from 'angular2-toaster';
 
-import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { UserService } from 'jslib-common/abstractions/user.service';
@@ -19,8 +17,6 @@ import { ProviderService } from '../services/provider.service';
 import { Organization } from 'jslib-common/models/domain/organization';
 import { Provider } from 'jslib-common/models/domain/provider';
 
-import { PlanType } from 'jslib-common/enums/planType';
-
 @Component({
     selector: 'provider-add-organization',
     templateUrl: 'add-organization.component.html',
@@ -36,9 +32,8 @@ export class AddOrganizationComponent implements OnInit {
     loading = true;
 
     constructor(private userService: UserService, private providerService: ProviderService,
-        private toasterService: ToasterService, private i18nService: I18nService,
-        private platformUtilsService: PlatformUtilsService, private validationService: ValidationService,
-        private apiService: ApiService) { }
+        private i18nService: I18nService, private platformUtilsService: PlatformUtilsService,
+        private validationService: ValidationService) { }
 
     async ngOnInit() {
         await this.load();
@@ -77,7 +72,7 @@ export class AddOrganizationComponent implements OnInit {
             this.formPromise = null;
         }
 
-        this.toasterService.popAsync('success', null, this.i18nService.t('organizationJoinedProvider'));
+        this.platformUtilsService.showToast('success', null, this.i18nService.t('organizationJoinedProvider'));
         this.onAddedOrganization.emit();
     }
 }
diff --git a/bitwarden_license/src/app/providers/clients/clients.component.ts b/bitwarden_license/src/app/providers/clients/clients.component.ts
index dabe0e9a1c6..7fa54d97bb6 100644
--- a/bitwarden_license/src/app/providers/clients/clients.component.ts
+++ b/bitwarden_license/src/app/providers/clients/clients.component.ts
@@ -5,7 +5,6 @@ import {
     ViewContainerRef
 } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
-import { ToasterService } from 'angular2-toaster';
 
 import { first } from 'rxjs/operators';
 
@@ -58,9 +57,8 @@ export class ClientsComponent implements OnInit {
     constructor(private route: ActivatedRoute, private userService: UserService,
         private apiService: ApiService, private searchService: SearchService,
         private platformUtilsService: PlatformUtilsService, private i18nService: I18nService,
-        private toasterService: ToasterService, private validationService: ValidationService,
-        private providerService: ProviderService, private logService: LogService,
-        private modalService: ModalService) { }
+        private validationService: ValidationService, private providerService: ProviderService,
+        private logService: LogService, private modalService: ModalService) { }
 
     async ngOnInit() {
         this.route.parent.params.subscribe(async params => {
@@ -149,7 +147,8 @@ export class ClientsComponent implements OnInit {
         this.actionPromise = this.providerService.detachOrganizastion(this.providerId, organization.id);
         try {
             await this.actionPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('detachedOrganization', organization.organizationName));
+            this.platformUtilsService.showToast('success', null,
+                this.i18nService.t('detachedOrganization', organization.organizationName));
             await this.load();
         } catch (e) {
             this.validationService.showError(e);
diff --git a/bitwarden_license/src/app/providers/manage/accept-provider.component.ts b/bitwarden_license/src/app/providers/manage/accept-provider.component.ts
index 1788f67cd52..1ca394393ff 100644
--- a/bitwarden_license/src/app/providers/manage/accept-provider.component.ts
+++ b/bitwarden_license/src/app/providers/manage/accept-provider.component.ts
@@ -1,12 +1,12 @@
 import { Component } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
-import { Toast, ToasterService } from 'angular2-toaster';
 
 import { BaseAcceptComponent } from 'src/app/common/base.accept.component';
 
 import { ApiService } from 'jslib-common/abstractions/api.service';
 
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { StateService } from 'jslib-common/abstractions/state.service';
 import { UserService } from 'jslib-common/abstractions/user.service';
 import { ProviderUserAcceptRequest } from 'jslib-common/models/request/provider/providerUserAcceptRequest';
@@ -22,9 +22,10 @@ export class AcceptProviderComponent extends BaseAcceptComponent {
 
     requiredParameters = ['providerId', 'providerUserId', 'token'];
 
-    constructor(router: Router, toasterService: ToasterService, i18nService: I18nService, route: ActivatedRoute,
-        userService: UserService, stateService: StateService, private apiService: ApiService) {
-        super(router, toasterService, i18nService, route, userService, stateService);
+    constructor(router: Router, i18nService: I18nService, route: ActivatedRoute,
+        userService: UserService, stateService: StateService, private apiService: ApiService,
+        platformUtilService: PlatformUtilsService) {
+        super(router, platformUtilService, i18nService, route, userService, stateService);
     }
 
     async authedHandler(qParams: any) {
@@ -32,13 +33,8 @@ export class AcceptProviderComponent extends BaseAcceptComponent {
         request.token = qParams.token;
 
         await this.apiService.postProviderUserAccept(qParams.providerId, qParams.providerUserId, request);
-        const toast: Toast = {
-            type: 'success',
-            title: this.i18nService.t('inviteAccepted'),
-            body: this.i18nService.t('providerInviteAcceptedDesc'),
-            timeout: 10000,
-        };
-        this.toasterService.popAsync(toast);
+        this.platformUtilService.showToast('success', this.i18nService.t('inviteAccepted'),
+            this.i18nService.t('providerInviteAcceptedDesc'), { timeout: 10000 });
         this.router.navigate(['/vault']);
     }
 
diff --git a/bitwarden_license/src/app/providers/manage/events.component.ts b/bitwarden_license/src/app/providers/manage/events.component.ts
index 2b9ce76d14b..00648b08c6d 100644
--- a/bitwarden_license/src/app/providers/manage/events.component.ts
+++ b/bitwarden_license/src/app/providers/manage/events.component.ts
@@ -3,7 +3,6 @@ import {
     OnInit,
 } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
-import { ToasterService } from 'angular2-toaster';
 
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { ExportService } from 'jslib-common/abstractions/export.service';
@@ -32,10 +31,10 @@ export class EventsComponent extends BaseEventsComponent implements OnInit {
     private providerUsersIdMap = new Map<string, any>();
 
     constructor(private apiService: ApiService, private route: ActivatedRoute, eventService: EventService,
-        i18nService: I18nService, toasterService: ToasterService, private userService: UserService,
-        exportService: ExportService, platformUtilsService: PlatformUtilsService, private router: Router,
-        logService: LogService, private userNamePipe: UserNamePipe) {
-        super(eventService, i18nService, toasterService, exportService, platformUtilsService, logService);
+        i18nService: I18nService, private userService: UserService, exportService: ExportService,
+        platformUtilsService: PlatformUtilsService, private router: Router, logService: LogService,
+        private userNamePipe: UserNamePipe) {
+        super(eventService, i18nService, exportService, platformUtilsService, logService);
     }
 
     async ngOnInit() {
diff --git a/bitwarden_license/src/app/providers/manage/people.component.ts b/bitwarden_license/src/app/providers/manage/people.component.ts
index 1027f38f785..4fb4582801a 100644
--- a/bitwarden_license/src/app/providers/manage/people.component.ts
+++ b/bitwarden_license/src/app/providers/manage/people.component.ts
@@ -5,7 +5,6 @@ import {
     ViewContainerRef
 } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
-import { ToasterService } from 'angular2-toaster';
 
 import { first } from 'rxjs/operators';
 
@@ -61,11 +60,11 @@ export class PeopleComponent extends BasePeopleComponent<ProviderUserUserDetails
 
     constructor(apiService: ApiService, private route: ActivatedRoute,
         i18nService: I18nService, modalService: ModalService,
-        platformUtilsService: PlatformUtilsService, toasterService: ToasterService,
+        platformUtilsService: PlatformUtilsService,
         cryptoService: CryptoService, private userService: UserService, private router: Router,
         storageService: StorageService, searchService: SearchService, validationService: ValidationService,
         logService: LogService, searchPipe: SearchPipe, userNamePipe: UserNamePipe) {
-        super(apiService, searchService, i18nService, platformUtilsService, toasterService, cryptoService,
+        super(apiService, searchService, i18nService, platformUtilsService, cryptoService,
             storageService, validationService, modalService, logService, searchPipe, userNamePipe);
     }
 
@@ -164,7 +163,7 @@ export class PeopleComponent extends BasePeopleComponent<ProviderUserUserDetails
         const filteredUsers = users.filter(u => u.status === ProviderUserStatusType.Invited);
 
         if (filteredUsers.length <= 0) {
-            this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
+            this.platformUtilsService.showToast('error', this.i18nService.t('errorOccurred'),
                 this.i18nService.t('noSelectedUsersApplicable'));
             return;
         }
diff --git a/bitwarden_license/src/app/providers/manage/user-add-edit.component.ts b/bitwarden_license/src/app/providers/manage/user-add-edit.component.ts
index 8fdcd47b9ee..487431b7dad 100644
--- a/bitwarden_license/src/app/providers/manage/user-add-edit.component.ts
+++ b/bitwarden_license/src/app/providers/manage/user-add-edit.component.ts
@@ -6,8 +6,6 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
@@ -44,8 +42,7 @@ export class UserAddEditComponent implements OnInit {
     userType = ProviderUserType;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private platformUtilsService: PlatformUtilsService,
-        private logService: LogService) { }
+        private platformUtilsService: PlatformUtilsService, private logService: LogService) { }
 
     async ngOnInit() {
         this.editMode = this.loading = this.providerUserId != null;
@@ -79,7 +76,7 @@ export class UserAddEditComponent implements OnInit {
                 this.formPromise = this.apiService.postProviderUserInvite(this.providerId, request);
             }
             await this.formPromise;
-            this.toasterService.popAsync('success', null,
+            this.platformUtilsService.showToast('success', null,
                 this.i18nService.t(this.editMode ? 'editedUserId' : 'invitedUsers', this.name));
             this.onSavedUser.emit();
         } catch (e) {
@@ -102,7 +99,7 @@ export class UserAddEditComponent implements OnInit {
         try {
             this.deletePromise = this.apiService.deleteProviderUser(this.providerId, this.providerUserId);
             await this.deletePromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('removedUserId', this.name));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('removedUserId', this.name));
             this.onDeletedUser.emit();
         } catch (e) {
             this.logService.error(e);
diff --git a/bitwarden_license/src/app/providers/services/provider-guard.service.ts b/bitwarden_license/src/app/providers/services/provider-guard.service.ts
index 5f1c5fc47d4..65d2df8cba8 100644
--- a/bitwarden_license/src/app/providers/services/provider-guard.service.ts
+++ b/bitwarden_license/src/app/providers/services/provider-guard.service.ts
@@ -5,15 +5,14 @@ import {
     Router,
 } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { UserService } from 'jslib-common/abstractions/user.service';
 
 @Injectable()
 export class ProviderGuardService implements CanActivate {
     constructor(private userService: UserService, private router: Router,
-        private toasterService: ToasterService, private i18nService: I18nService) { }
+        private platformUtilsService: PlatformUtilsService, private i18nService: I18nService) { }
 
     async canActivate(route: ActivatedRouteSnapshot) {
         const provider = await this.userService.getProvider(route.params.providerId);
@@ -22,7 +21,7 @@ export class ProviderGuardService implements CanActivate {
             return false;
         }
         if (!provider.isProviderAdmin && !provider.enabled) {
-            this.toasterService.popAsync('error', null, this.i18nService.t('providerIsDisabled'));
+            this.platformUtilsService.showToast('error', null, this.i18nService.t('providerIsDisabled'));
             this.router.navigate(['/']);
             return false;
         }
diff --git a/bitwarden_license/src/app/providers/settings/account.component.ts b/bitwarden_license/src/app/providers/settings/account.component.ts
index 7e26eed4fdc..551f9b11622 100644
--- a/bitwarden_license/src/app/providers/settings/account.component.ts
+++ b/bitwarden_license/src/app/providers/settings/account.component.ts
@@ -1,6 +1,5 @@
 import { Component } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
-import { ToasterService } from 'angular2-toaster';
 
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
@@ -26,9 +25,8 @@ export class AccountComponent {
     private providerId: string;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private route: ActivatedRoute,
-        private syncService: SyncService, private platformUtilsService: PlatformUtilsService,
-        private logService: LogService) { }
+        private route: ActivatedRoute, private syncService: SyncService,
+        private platformUtilsService: PlatformUtilsService, private logService: LogService) { }
 
     async ngOnInit() {
         this.selfHosted = this.platformUtilsService.isSelfHost();
@@ -54,7 +52,7 @@ export class AccountComponent {
                 return this.syncService.fullSync(true);
             });
             await this.formPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('providerUpdated'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('providerUpdated'));
         } catch (e) {
             this.logService.error(`Handled exception: ${e}`);
         }
diff --git a/bitwarden_license/src/app/providers/setup/setup.component.ts b/bitwarden_license/src/app/providers/setup/setup.component.ts
index edad48acd95..e343a1fd8c1 100644
--- a/bitwarden_license/src/app/providers/setup/setup.component.ts
+++ b/bitwarden_license/src/app/providers/setup/setup.component.ts
@@ -6,10 +6,6 @@ import {
     ActivatedRoute,
     Router,
 } from '@angular/router';
-import {
-    Toast,
-    ToasterService,
-} from 'angular2-toaster';
 
 import { first } from 'rxjs/operators';
 
@@ -18,6 +14,7 @@ import { CryptoService } from 'jslib-common/abstractions/crypto.service';
 
 import { ValidationService } from 'jslib-angular/services/validation.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { SyncService } from 'jslib-common/abstractions/sync.service';
 import { ProviderSetupRequest } from 'jslib-common/models/request/provider/providerSetupRequest';
 
@@ -36,7 +33,7 @@ export class SetupComponent implements OnInit {
     name: string;
     billingEmail: string;
 
-    constructor(private router: Router, private toasterService: ToasterService,
+    constructor(private router: Router, private platformUtilsService: PlatformUtilsService,
         private i18nService: I18nService, private route: ActivatedRoute,
         private cryptoService: CryptoService, private apiService: ApiService,
         private syncService: SyncService, private validationService: ValidationService) { }
@@ -47,13 +44,8 @@ export class SetupComponent implements OnInit {
             const error = qParams.providerId == null || qParams.email == null || qParams.token == null;
 
             if (error) {
-                const toast: Toast = {
-                    type: 'error',
-                    title: null,
-                    body: this.i18nService.t('emergencyInviteAcceptFailed'),
-                    timeout: 10000,
-                };
-                this.toasterService.popAsync(toast);
+                this.platformUtilsService.showToast('error', null, this.i18nService.t('emergencyInviteAcceptFailed'),
+                    { timeout: 10000 });
                 this.router.navigate(['/']);
                 return;
             }
@@ -92,7 +84,7 @@ export class SetupComponent implements OnInit {
             request.key = key;
 
             const provider = await this.apiService.postProviderSetup(this.providerId, request);
-            this.toasterService.popAsync('success', null, this.i18nService.t('providerSetup'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('providerSetup'));
             await this.syncService.fullSync(true);
 
             this.router.navigate(['/providers', provider.id]);
diff --git a/jslib b/jslib
index 5db94cc9d06..a6b95b15e36 160000
--- a/jslib
+++ b/jslib
@@ -1 +1 @@
-Subproject commit 5db94cc9d06ba478a29e9b625993108dfa0d7ec8
+Subproject commit a6b95b15e36737ccf2e7664ed3c881bc19366b84
diff --git a/package-lock.json b/package-lock.json
index ab14640ed37..546a0640ea7 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -12,7 +12,6 @@
       "dependencies": {
         "@bitwarden/jslib-angular": "file:jslib/angular",
         "@bitwarden/jslib-common": "file:jslib/common",
-        "angular2-toaster": "11.0.1",
         "bootstrap": "4.6.0",
         "braintree-web-drop-in": "1.30.1",
         "browser-hrtime": "^1.1.8",
@@ -21,6 +20,7 @@
         "font-awesome": "4.7.0",
         "jquery": "3.6.0",
         "ngx-infinite-scroll": "^10.0.1",
+        "ngx-toastr": "^13.2.1",
         "popper.js": "1.16.1",
         "qrious": "4.0.2",
         "sweetalert2": "^10.16.6",
@@ -1267,20 +1267,6 @@
         "ajv": "^6.9.1"
       }
     },
-    "node_modules/angular2-toaster": {
-      "version": "11.0.1",
-      "resolved": "https://registry.npmjs.org/angular2-toaster/-/angular2-toaster-11.0.1.tgz",
-      "integrity": "sha512-IRXE5zujPMNOhckcp+Hk2n+UrKSrlAviz55wGvSd9ECrqsSRjgh148UEtgsqkcYQ8leKcybZ4d0lrueDuQofNA==",
-      "dependencies": {
-        "tslib": "^2.0.0"
-      },
-      "peerDependencies": {
-        "@angular/common": "^11.0.0",
-        "@angular/compiler": "^11.0.0",
-        "@angular/core": "^11.0.0",
-        "rxjs": "^6.5.3"
-      }
-    },
     "node_modules/ansi-colors": {
       "version": "3.2.4",
       "resolved": "https://registry.npmjs.org/ansi-colors/-/ansi-colors-3.2.4.tgz",
@@ -6336,6 +6322,19 @@
         "opencollective-postinstall": "^2.0.2"
       }
     },
+    "node_modules/ngx-toastr": {
+      "version": "13.2.1",
+      "resolved": "https://registry.npmjs.org/ngx-toastr/-/ngx-toastr-13.2.1.tgz",
+      "integrity": "sha512-UAzp7/xWK9IXA2LsOmhpaaIGCqscvJokoQpBNpAMrjEkDeSlFf8PWQAuQY795KW0mJb3qF9UG/s23nsXfMYKmg==",
+      "dependencies": {
+        "tslib": "^2.0.0"
+      },
+      "peerDependencies": {
+        "@angular/common": ">=10.0.0-0",
+        "@angular/core": ">=10.0.0-0",
+        "@angular/platform-browser": ">=10.0.0-0"
+      }
+    },
     "node_modules/nice-try": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz",
@@ -12493,14 +12492,6 @@
       "dev": true,
       "requires": {}
     },
-    "angular2-toaster": {
-      "version": "11.0.1",
-      "resolved": "https://registry.npmjs.org/angular2-toaster/-/angular2-toaster-11.0.1.tgz",
-      "integrity": "sha512-IRXE5zujPMNOhckcp+Hk2n+UrKSrlAviz55wGvSd9ECrqsSRjgh148UEtgsqkcYQ8leKcybZ4d0lrueDuQofNA==",
-      "requires": {
-        "tslib": "^2.0.0"
-      }
-    },
     "ansi-colors": {
       "version": "3.2.4",
       "resolved": "https://registry.npmjs.org/ansi-colors/-/ansi-colors-3.2.4.tgz",
@@ -16501,6 +16492,14 @@
         "opencollective-postinstall": "^2.0.2"
       }
     },
+    "ngx-toastr": {
+      "version": "13.2.1",
+      "resolved": "https://registry.npmjs.org/ngx-toastr/-/ngx-toastr-13.2.1.tgz",
+      "integrity": "sha512-UAzp7/xWK9IXA2LsOmhpaaIGCqscvJokoQpBNpAMrjEkDeSlFf8PWQAuQY795KW0mJb3qF9UG/s23nsXfMYKmg==",
+      "requires": {
+        "tslib": "^2.0.0"
+      }
+    },
     "nice-try": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz",
diff --git a/package.json b/package.json
index 8bbc3675c63..5debad8ae13 100644
--- a/package.json
+++ b/package.json
@@ -66,7 +66,6 @@
   "dependencies": {
     "@bitwarden/jslib-angular": "file:jslib/angular",
     "@bitwarden/jslib-common": "file:jslib/common",
-    "angular2-toaster": "11.0.1",
     "bootstrap": "4.6.0",
     "braintree-web-drop-in": "1.30.1",
     "browser-hrtime": "^1.1.8",
@@ -75,6 +74,7 @@
     "font-awesome": "4.7.0",
     "jquery": "3.6.0",
     "ngx-infinite-scroll": "^10.0.1",
+    "ngx-toastr": "^13.2.1",
     "popper.js": "1.16.1",
     "qrious": "4.0.2",
     "sweetalert2": "^10.16.6",
diff --git a/src/app/accounts/accept-emergency.component.ts b/src/app/accounts/accept-emergency.component.ts
index 5caba800937..b44013724fb 100644
--- a/src/app/accounts/accept-emergency.component.ts
+++ b/src/app/accounts/accept-emergency.component.ts
@@ -4,13 +4,9 @@ import {
     Router,
 } from '@angular/router';
 
-import {
-    Toast,
-    ToasterService,
-} from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { StateService } from 'jslib-common/abstractions/state.service';
 import { UserService } from 'jslib-common/abstractions/user.service';
 import { EmergencyAccessAcceptRequest } from 'jslib-common/models/request/emergencyAccessAcceptRequest';
@@ -28,11 +24,11 @@ export class AcceptEmergencyComponent extends BaseAcceptComponent {
     protected failedShortMessage = 'emergencyInviteAcceptFailedShort';
     protected failedMessage = 'emergencyInviteAcceptFailed';
 
-    constructor(router: Router, toasterService: ToasterService,
+    constructor(router: Router, platformUtilsService: PlatformUtilsService,
         i18nService: I18nService, route: ActivatedRoute,
         private apiService: ApiService, userService: UserService,
         stateService: StateService) {
-        super(router, toasterService, i18nService, route, userService, stateService);
+        super(router, platformUtilsService, i18nService, route, userService, stateService);
     }
 
     async authedHandler(qParams: any): Promise<void> {
@@ -40,13 +36,8 @@ export class AcceptEmergencyComponent extends BaseAcceptComponent {
         request.token = qParams.token;
         this.actionPromise = this.apiService.postEmergencyAccessAccept(qParams.id, request);
         await this.actionPromise;
-        const toast: Toast = {
-            type: 'success',
-            title: this.i18nService.t('inviteAccepted'),
-            body: this.i18nService.t('emergencyInviteAcceptedDesc'),
-            timeout: 10000,
-        };
-        this.toasterService.popAsync(toast);
+        this.platformUtilService.showToast('success', this.i18nService.t('inviteAccepted'),
+            this.i18nService.t('emergencyInviteAcceptedDesc'), {timeout: 10000});
         this.router.navigate(['/vault']);
     }
 
diff --git a/src/app/accounts/accept-organization.component.ts b/src/app/accounts/accept-organization.component.ts
index 267ce84005f..508a8862f1c 100644
--- a/src/app/accounts/accept-organization.component.ts
+++ b/src/app/accounts/accept-organization.component.ts
@@ -4,15 +4,11 @@ import {
     Router,
 } from '@angular/router';
 
-import {
-    Toast,
-    ToasterService,
-} from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CryptoService } from 'jslib-common/abstractions/crypto.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { PolicyService } from 'jslib-common/abstractions/policy.service';
 import { StateService } from 'jslib-common/abstractions/state.service';
 import { UserService } from 'jslib-common/abstractions/user.service';
@@ -33,12 +29,12 @@ export class AcceptOrganizationComponent extends BaseAcceptComponent {
 
     protected requiredParameters: string[] = ['organizationId', 'organizationUserId', 'token'];
 
-    constructor(router: Router, toasterService: ToasterService,
+    constructor(router: Router, platformUtilsService: PlatformUtilsService,
         i18nService: I18nService, route: ActivatedRoute,
         private apiService: ApiService, userService: UserService,
         stateService: StateService, private cryptoService: CryptoService,
         private policyService: PolicyService, private logService: LogService) {
-        super(router, toasterService, i18nService, route, userService, stateService);
+        super(router, platformUtilsService, i18nService, route, userService, stateService);
     }
 
     async authedHandler(qParams: any): Promise<void> {
@@ -75,13 +71,8 @@ export class AcceptOrganizationComponent extends BaseAcceptComponent {
         }
 
         await this.actionPromise;
-        const toast: Toast = {
-            type: 'success',
-            title: this.i18nService.t('inviteAccepted'),
-            body: this.i18nService.t('inviteAcceptedDesc'),
-            timeout: 10000,
-        };
-        this.toasterService.popAsync(toast);
+        this.platformUtilService.showToast('success', this.i18nService.t('inviteAccepted'),
+            this.i18nService.t('inviteAcceptedDesc'), {timeout: 10000});
 
         await this.stateService.remove('orgInvitation');
         this.router.navigate(['/vault']);
diff --git a/src/app/accounts/recover-delete.component.ts b/src/app/accounts/recover-delete.component.ts
index aaf53cb73ca..26308df49f4 100644
--- a/src/app/accounts/recover-delete.component.ts
+++ b/src/app/accounts/recover-delete.component.ts
@@ -1,11 +1,10 @@
 import { Component } from '@angular/core';
 import { Router } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 
 import { DeleteRecoverRequest } from 'jslib-common/models/request/deleteRecoverRequest';
 
@@ -18,7 +17,7 @@ export class RecoverDeleteComponent {
     formPromise: Promise<any>;
 
     constructor(private router: Router, private apiService: ApiService,
-        private toasterService: ToasterService, private i18nService: I18nService,
+        private platformUtilsService: PlatformUtilsService, private i18nService: I18nService,
         private logService: LogService) {
     }
 
@@ -28,7 +27,7 @@ export class RecoverDeleteComponent {
             request.email = this.email.trim().toLowerCase();
             this.formPromise = this.apiService.postAccountRecoverDelete(request);
             await this.formPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('deleteRecoverEmailSent'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('deleteRecoverEmailSent'));
             this.router.navigate(['/']);
         } catch (e) {
             this.logService.error(e);
diff --git a/src/app/accounts/recover-two-factor.component.ts b/src/app/accounts/recover-two-factor.component.ts
index 4d7263d1626..e0403745be8 100644
--- a/src/app/accounts/recover-two-factor.component.ts
+++ b/src/app/accounts/recover-two-factor.component.ts
@@ -1,13 +1,12 @@
 import { Component } from '@angular/core';
 import { Router } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { AuthService } from 'jslib-common/abstractions/auth.service';
 import { CryptoService } from 'jslib-common/abstractions/crypto.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 
 import { TwoFactorRecoveryRequest } from 'jslib-common/models/request/twoFactorRecoveryRequest';
 
@@ -22,7 +21,7 @@ export class RecoverTwoFactorComponent {
     formPromise: Promise<any>;
 
     constructor(private router: Router, private apiService: ApiService,
-        private toasterService: ToasterService, private i18nService: I18nService,
+        private platformUtilsService: PlatformUtilsService, private i18nService: I18nService,
         private cryptoService: CryptoService, private authService: AuthService,
         private logService: LogService) { }
 
@@ -35,7 +34,7 @@ export class RecoverTwoFactorComponent {
             request.masterPasswordHash = await this.cryptoService.hashPassword(this.masterPassword, key);
             this.formPromise = this.apiService.postTwoFactorRecover(request);
             await this.formPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('twoStepRecoverDisabled'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('twoStepRecoverDisabled'));
             this.router.navigate(['/']);
         } catch (e) {
             this.logService.error(e);
diff --git a/src/app/accounts/verify-email-token.component.ts b/src/app/accounts/verify-email-token.component.ts
index aac7bac763e..4664727d934 100644
--- a/src/app/accounts/verify-email-token.component.ts
+++ b/src/app/accounts/verify-email-token.component.ts
@@ -9,11 +9,10 @@ import {
 
 import { first } from 'rxjs/operators';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { UserService } from 'jslib-common/abstractions/user.service';
 
 import { VerifyEmailRequest } from 'jslib-common/models/request/verifyEmailRequest';
@@ -23,7 +22,7 @@ import { VerifyEmailRequest } from 'jslib-common/models/request/verifyEmailReque
     templateUrl: 'verify-email-token.component.html',
 })
 export class VerifyEmailTokenComponent implements OnInit {
-    constructor(private router: Router, private toasterService: ToasterService,
+    constructor(private router: Router, private platformUtilsService: PlatformUtilsService,
         private i18nService: I18nService, private route: ActivatedRoute,
         private apiService: ApiService, private userService: UserService,
         private logService: LogService) { }
@@ -38,14 +37,14 @@ export class VerifyEmailTokenComponent implements OnInit {
                     if (authed) {
                         await this.apiService.refreshIdentityToken();
                     }
-                    this.toasterService.popAsync('success', null, this.i18nService.t('emailVerified'));
+                    this.platformUtilsService.showToast('success', null, this.i18nService.t('emailVerified'));
                     this.router.navigate(['/']);
                     return;
                 } catch (e) {
                     this.logService.error(e);
                 }
             }
-            this.toasterService.popAsync('error', null, this.i18nService.t('emailVerifiedFailed'));
+            this.platformUtilsService.showToast('error', null, this.i18nService.t('emailVerifiedFailed'));
             this.router.navigate(['/']);
         });
     }
diff --git a/src/app/accounts/verify-recover-delete.component.ts b/src/app/accounts/verify-recover-delete.component.ts
index 524eaf320ba..a6f20b5b893 100644
--- a/src/app/accounts/verify-recover-delete.component.ts
+++ b/src/app/accounts/verify-recover-delete.component.ts
@@ -9,11 +9,10 @@ import {
 
 import { first } from 'rxjs/operators';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 
 import { VerifyDeleteRecoverRequest } from 'jslib-common/models/request/verifyDeleteRecoverRequest';
 
@@ -29,7 +28,7 @@ export class VerifyRecoverDeleteComponent implements OnInit {
     private token: string;
 
     constructor(private router: Router, private apiService: ApiService,
-        private toasterService: ToasterService, private i18nService: I18nService,
+        private platformUtilsService: PlatformUtilsService, private i18nService: I18nService,
         private route: ActivatedRoute, private logService: LogService) {
     }
 
@@ -50,7 +49,7 @@ export class VerifyRecoverDeleteComponent implements OnInit {
             const request = new VerifyDeleteRecoverRequest(this.userId, this.token);
             this.formPromise = this.apiService.postAccountRecoverDeleteToken(request);
             await this.formPromise;
-            this.toasterService.popAsync('success', this.i18nService.t('accountDeleted'),
+            this.platformUtilsService.showToast('success', this.i18nService.t('accountDeleted'),
                 this.i18nService.t('accountDeletedDesc'));
             this.router.navigate(['/']);
         } catch (e) {
diff --git a/src/app/app.component.html b/src/app/app.component.html
index 9d5a7a3e198..0680b43f9c6 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -1,2 +1 @@
-<toaster-container [toasterconfig]="toasterConfig" aria-live="polite"></toaster-container>
 <router-outlet></router-outlet>
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index a2e668762de..256aafc7639 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -1,13 +1,3 @@
-import * as jq from 'jquery';
-import Swal from 'sweetalert2';
-
-import {
-    BodyOutputType,
-    Toast,
-    ToasterConfig,
-    ToasterService,
-} from 'angular2-toaster';
-
 import {
     Component,
     NgZone,
@@ -20,6 +10,9 @@ import {
     NavigationEnd,
     Router,
 } from '@angular/router';
+import * as jq from 'jquery';
+import { IndividualConfig, ToastrService } from 'ngx-toastr';
+import Swal from 'sweetalert2';
 
 import { AuthService } from 'jslib-common/abstractions/auth.service';
 import { BroadcasterService } from 'jslib-common/abstractions/broadcaster.service';
@@ -67,13 +60,6 @@ const IdleTimeout = 60000 * 10; // 10 minutes
 })
 export class AppComponent implements OnDestroy, OnInit {
 
-    toasterConfig: ToasterConfig = new ToasterConfig({
-        showCloseButton: true,
-        mouseoverTimerStop: true,
-        animation: 'flyRight',
-        limit: 5,
-    });
-
     private lastActivity: number = null;
     private idleTimer: number = null;
     private isIdle = false;
@@ -84,7 +70,7 @@ export class AppComponent implements OnDestroy, OnInit {
         private settingsService: SettingsService, private syncService: SyncService,
         private passwordGenerationService: PasswordGenerationService, private cipherService: CipherService,
         private authService: AuthService, private router: Router,
-        private toasterService: ToasterService, private i18nService: I18nService,
+        private toastrService: ToastrService, private i18nService: I18nService,
         private platformUtilsService: PlatformUtilsService, private ngZone: NgZone,
         private vaultTimeoutService: VaultTimeoutService, private storageService: StorageService,
         private cryptoService: CryptoService, private collectionService: CollectionService,
@@ -228,7 +214,7 @@ export class AppComponent implements OnDestroy, OnInit {
         this.searchService.clearIndex();
         this.authService.logOut(async () => {
             if (expired) {
-                this.toasterService.popAsync('warning', this.i18nService.t('loggedOut'),
+                this.platformUtilsService.showToast('warning', this.i18nService.t('loggedOut'),
                     this.i18nService.t('loginExpired'));
             }
 
@@ -264,30 +250,29 @@ export class AppComponent implements OnDestroy, OnInit {
     }
 
     private showToast(msg: any) {
-        const toast: Toast = {
-            type: msg.type,
-            title: msg.title,
-        };
+        let message = '';
+
+        const options: Partial<IndividualConfig> = {};
+
         if (typeof (msg.text) === 'string') {
-            toast.body = msg.text;
+            message = msg.text;
         } else if (msg.text.length === 1) {
-            toast.body = msg.text[0];
+            message = msg.text[0];
         } else {
-            let message = '';
             msg.text.forEach((t: string) =>
                 message += ('<p>' + this.sanitizer.sanitize(SecurityContext.HTML, t) + '</p>'));
-            toast.body = message;
-            toast.bodyOutputType = BodyOutputType.TrustedHtml;
+            options.enableHtml = true;
         }
         if (msg.options != null) {
             if (msg.options.trustedHtml === true) {
-                toast.bodyOutputType = BodyOutputType.TrustedHtml;
+                options.enableHtml = true;
             }
             if (msg.options.timeout != null && msg.options.timeout > 0) {
-                toast.timeout = msg.options.timeout;
+                options.timeOut = msg.options.timeout;
             }
         }
-        this.toasterService.popAsync(toast);
+
+        this.toastrService.show(message, msg.title, options, 'toast-' + msg.type);
     }
 
     private idleStateChanged() {
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 5ad3b62ffc0..a39ac073b6b 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -1,4 +1,3 @@
-import { ToasterModule } from 'angular2-toaster';
 import { InfiniteScrollModule } from 'ngx-infinite-scroll';
 
 import { DragDropModule } from '@angular/cdk/drag-drop';
@@ -6,6 +5,8 @@ import { NgModule } from '@angular/core';
 import { FormsModule } from '@angular/forms';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 
+import { BitwardenToastModule } from 'jslib-angular/components/toastr.component';
+
 import { AppComponent } from './app.component';
 import { OssRoutingModule } from './oss-routing.module';
 import { OssModule } from './oss.module';
@@ -18,7 +19,11 @@ import { WildcardRoutingModule } from './wildcard-routing.module';
         BrowserAnimationsModule,
         FormsModule,
         ServicesModule,
-        ToasterModule.forRoot(),
+        BitwardenToastModule.forRoot({
+            maxOpened: 5,
+            autoDismiss: true,
+            closeButton: true,
+        }),
         InfiniteScrollModule,
         DragDropModule,
         OssRoutingModule,
diff --git a/src/app/common/base.accept.component.ts b/src/app/common/base.accept.component.ts
index f18cfcff8ec..d149ca9fddd 100644
--- a/src/app/common/base.accept.component.ts
+++ b/src/app/common/base.accept.component.ts
@@ -7,14 +7,10 @@ import {
     Router,
 } from '@angular/router';
 
-import {
-    Toast,
-    ToasterService,
-} from 'angular2-toaster';
-
 import { first } from 'rxjs/operators';
 
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { StateService } from 'jslib-common/abstractions/state.service';
 import { UserService } from 'jslib-common/abstractions/user.service';
 
@@ -29,7 +25,7 @@ export abstract class BaseAcceptComponent implements OnInit {
     protected failedShortMessage = 'inviteAcceptFailedShort';
     protected failedMessage = 'inviteAcceptFailed';
 
-    constructor(protected router: Router, protected toasterService: ToasterService,
+    constructor(protected router: Router, protected platformUtilService: PlatformUtilsService,
         protected i18nService: I18nService, protected route: ActivatedRoute,
         protected userService: UserService, protected stateService: StateService) { }
 
@@ -64,14 +60,9 @@ export abstract class BaseAcceptComponent implements OnInit {
             }
 
             if (error) {
-                const toast: Toast = {
-                    type: 'error',
-                    title: null,
-                    body: errorMessage != null ? this.i18nService.t(this.failedShortMessage, errorMessage) :
-                        this.i18nService.t(this.failedMessage),
-                    timeout: 10000,
-                };
-                this.toasterService.popAsync(toast);
+                const message = errorMessage != null ? this.i18nService.t(this.failedShortMessage, errorMessage) :
+                        this.i18nService.t(this.failedMessage);
+                this.platformUtilService.showToast('error', null, message, {timeout: 10000});
                 this.router.navigate(['/']);
             }
 
diff --git a/src/app/common/base.events.component.ts b/src/app/common/base.events.component.ts
index 5b22d9c74fb..07392cd54e8 100644
--- a/src/app/common/base.events.component.ts
+++ b/src/app/common/base.events.component.ts
@@ -1,5 +1,4 @@
 import { Directive } from '@angular/core';
-import { ToasterService } from 'angular2-toaster';
 
 import { ExportService } from 'jslib-common/abstractions/export.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
@@ -29,8 +28,8 @@ export abstract class BaseEventsComponent {
     abstract readonly exportFileName: string;
 
     constructor(protected eventService: EventService, protected i18nService: I18nService,
-        protected toasterService: ToasterService, protected exportService: ExportService,
-        protected platformUtilsService: PlatformUtilsService, protected logService: LogService) {
+        protected exportService: ExportService, protected platformUtilsService: PlatformUtilsService,
+        protected logService: LogService) {
         const defaultDates = this.eventService.getDefaultDateFilters();
         this.start = defaultDates[0];
         this.end = defaultDates[1];
@@ -129,7 +128,7 @@ export abstract class BaseEventsComponent {
         try {
             dates = this.eventService.formatDateFilters(this.start, this.end);
         } catch (e) {
-            this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
+            this.platformUtilsService.showToast('error', this.i18nService.t('errorOccurred'),
                 this.i18nService.t('invalidDateRange'));
             return null;
         }
diff --git a/src/app/common/base.people.component.ts b/src/app/common/base.people.component.ts
index 6e769817d07..25085ca9c70 100644
--- a/src/app/common/base.people.component.ts
+++ b/src/app/common/base.people.component.ts
@@ -3,7 +3,6 @@ import {
     ViewChild,
     ViewContainerRef
 } from '@angular/core';
-import { ToasterService } from 'angular2-toaster';
 
 import { ValidationService } from 'jslib-angular/services/validation.service';
 import { ApiService } from 'jslib-common/abstractions/api.service';
@@ -90,8 +89,8 @@ export abstract class BasePeopleComponent<UserType extends ProviderUserUserDetai
     private pagedUsersCount = 0;
 
     constructor(protected apiService: ApiService, private searchService: SearchService,
-        protected i18nService: I18nService, private platformUtilsService: PlatformUtilsService,
-        protected toasterService: ToasterService, protected cryptoService: CryptoService,
+        protected i18nService: I18nService, protected platformUtilsService: PlatformUtilsService,
+        protected cryptoService: CryptoService,
         private storageService: StorageService, protected validationService: ValidationService,
         protected modalService: ModalService, private logService: LogService,
         private searchPipe: SearchPipe, protected userNamePipe: UserNamePipe ) { }
@@ -190,7 +189,8 @@ export abstract class BasePeopleComponent<UserType extends ProviderUserUserDetai
         this.actionPromise = this.deleteUser(user.id);
         try {
             await this.actionPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('removedUserId', this.userNamePipe.transform(user)));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('removedUserId',
+                this.userNamePipe.transform(user)));
             this.removeUser(user);
         } catch (e) {
             this.validationService.showError(e);
@@ -206,7 +206,8 @@ export abstract class BasePeopleComponent<UserType extends ProviderUserUserDetai
         this.actionPromise = this.reinviteUser(user.id);
         try {
             await this.actionPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('hasBeenReinvited', this.userNamePipe.transform(user)));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('hasBeenReinvited',
+                this.userNamePipe.transform(user)));
         } catch (e) {
             this.validationService.showError(e);
         }
@@ -228,7 +229,8 @@ export abstract class BasePeopleComponent<UserType extends ProviderUserUserDetai
                 this.actionPromise = this.confirmUser(user, publicKey);
                 await this.actionPromise;
                 updateUser(this);
-                this.toasterService.popAsync('success', null, this.i18nService.t('hasBeenConfirmed', this.userNamePipe.transform(user)));
+                this.platformUtilsService.showToast('success', null, this.i18nService.t('hasBeenConfirmed',
+                    this.userNamePipe.transform(user)));
             } catch (e) {
                 this.validationService.showError(e);
                 throw e;
diff --git a/src/app/organizations/manage/collection-add-edit.component.ts b/src/app/organizations/manage/collection-add-edit.component.ts
index c4c66e6e79f..fc973a9f468 100644
--- a/src/app/organizations/manage/collection-add-edit.component.ts
+++ b/src/app/organizations/manage/collection-add-edit.component.ts
@@ -6,8 +6,6 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CryptoService } from 'jslib-common/abstractions/crypto.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
@@ -48,7 +46,7 @@ export class CollectionAddEditComponent implements OnInit {
     private orgKey: SymmetricCryptoKey;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private platformUtilsService: PlatformUtilsService,
+        private platformUtilsService: PlatformUtilsService,
         private cryptoService: CryptoService, private userService: UserService,
         private logService: LogService) { }
 
@@ -128,7 +126,7 @@ export class CollectionAddEditComponent implements OnInit {
                 this.formPromise = this.apiService.postCollection(this.organizationId, request);
             }
             await this.formPromise;
-            this.toasterService.popAsync('success', null,
+            this.platformUtilsService.showToast('success', null,
                 this.i18nService.t(this.editMode ? 'editedCollectionId' : 'createdCollectionId', this.name));
             this.onSavedCollection.emit();
         } catch (e) {
@@ -151,7 +149,7 @@ export class CollectionAddEditComponent implements OnInit {
         try {
             this.deletePromise = this.apiService.deleteCollection(this.organizationId, this.collectionId);
             await this.deletePromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('deletedCollectionId', this.name));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('deletedCollectionId', this.name));
             this.onDeletedCollection.emit();
         } catch (e) {
             this.logService.error(e);
diff --git a/src/app/organizations/manage/collections.component.ts b/src/app/organizations/manage/collections.component.ts
index 14171cd1740..d43252d74a1 100644
--- a/src/app/organizations/manage/collections.component.ts
+++ b/src/app/organizations/manage/collections.component.ts
@@ -5,7 +5,6 @@ import {
     ViewContainerRef,
 } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
-import { ToasterService } from 'angular2-toaster';
 
 import { first } from 'rxjs/operators';
 
@@ -56,7 +55,7 @@ export class CollectionsComponent implements OnInit {
 
     constructor(private apiService: ApiService, private route: ActivatedRoute,
         private collectionService: CollectionService, private modalService: ModalService,
-        private toasterService: ToasterService, private i18nService: I18nService,
+        private i18nService: I18nService,
         private platformUtilsService: PlatformUtilsService, private userService: UserService,
         private searchService: SearchService, private logService: LogService) { }
 
@@ -119,7 +118,7 @@ export class CollectionsComponent implements OnInit {
         const canDelete = collection != null && this.canDelete(collection);
 
         if (!(canCreate || canEdit || canDelete)) {
-            this.toasterService.popAsync('error', null, this.i18nService.t('missingPermissions'));
+            this.platformUtilsService.showToast('error', null, this.i18nService.t('missingPermissions'));
             return;
         }
 
@@ -153,11 +152,11 @@ export class CollectionsComponent implements OnInit {
 
         try {
             await this.apiService.deleteCollection(this.organizationId, collection.id);
-            this.toasterService.popAsync('success', null, this.i18nService.t('deletedCollectionId', collection.name));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('deletedCollectionId', collection.name));
             this.removeCollection(collection);
         } catch (e) {
             this.logService.error(e);
-            this.toasterService.popAsync('error', null, this.i18nService.t('missingPermissions'));
+            this.platformUtilsService.showToast('error', null, this.i18nService.t('missingPermissions'));
         }
     }
 
diff --git a/src/app/organizations/manage/entity-events.component.ts b/src/app/organizations/manage/entity-events.component.ts
index ceadd483680..f451a4a7de0 100644
--- a/src/app/organizations/manage/entity-events.component.ts
+++ b/src/app/organizations/manage/entity-events.component.ts
@@ -4,8 +4,6 @@ import {
     OnInit,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
@@ -14,6 +12,7 @@ import { EventService } from '../../services/event.service';
 
 import { UserNamePipe } from 'jslib-angular/pipes/user-name.pipe';
 
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { EventResponse } from 'jslib-common/models/response/eventResponse';
 import { ListResponse } from 'jslib-common/models/response/listResponse';
 
@@ -42,7 +41,7 @@ export class EntityEventsComponent implements OnInit {
     private orgUsersIdMap = new Map<string, any>();
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private eventService: EventService, private toasterService: ToasterService,
+        private eventService: EventService, private platformUtilsService: PlatformUtilsService,
         private userNamePipe: UserNamePipe, private logService: LogService) { }
 
     async ngOnInit() {
@@ -74,7 +73,7 @@ export class EntityEventsComponent implements OnInit {
         try {
             dates = this.eventService.formatDateFilters(this.start, this.end);
         } catch (e) {
-            this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
+            this.platformUtilsService.showToast('error', this.i18nService.t('errorOccurred'),
                 this.i18nService.t('invalidDateRange'));
             return;
         }
diff --git a/src/app/organizations/manage/entity-users.component.ts b/src/app/organizations/manage/entity-users.component.ts
index 999e8cf3544..094f11584d0 100644
--- a/src/app/organizations/manage/entity-users.component.ts
+++ b/src/app/organizations/manage/entity-users.component.ts
@@ -6,8 +6,6 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
@@ -17,6 +15,7 @@ import { OrganizationUserType } from 'jslib-common/enums/organizationUserType';
 import { SelectionReadOnlyRequest } from 'jslib-common/models/request/selectionReadOnlyRequest';
 import { OrganizationUserUserDetailsResponse } from 'jslib-common/models/response/organizationUserResponse';
 
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { Utils } from 'jslib-common/misc/utils';
 
 @Component({
@@ -42,7 +41,7 @@ export class EntityUsersComponent implements OnInit {
     private allUsers: OrganizationUserUserDetailsResponse[] = [];
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private logService: LogService) { }
+        private platformUtilsService: PlatformUtilsService, private logService: LogService) { }
 
     async ngOnInit() {
         await this.loadUsers();
@@ -129,7 +128,7 @@ export class EntityUsersComponent implements OnInit {
                 this.formPromise = this.apiService.putCollectionUsers(this.organizationId, this.entityId, selections);
             }
             await this.formPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('updatedUsers'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('updatedUsers'));
             this.onEditedUsers.emit();
         } catch (e) {
             this.logService.error(e);
diff --git a/src/app/organizations/manage/events.component.ts b/src/app/organizations/manage/events.component.ts
index d428c5e1a26..cfaaa800feb 100644
--- a/src/app/organizations/manage/events.component.ts
+++ b/src/app/organizations/manage/events.component.ts
@@ -3,7 +3,6 @@ import {
     OnInit,
 } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
-import { ToasterService } from 'angular2-toaster';
 
 import { UserNamePipe } from 'jslib-angular/pipes/user-name.pipe';
 
@@ -33,10 +32,10 @@ export class EventsComponent extends BaseEventsComponent implements OnInit {
     private orgUsersUserIdMap = new Map<string, any>();
 
     constructor(private apiService: ApiService, private route: ActivatedRoute, eventService: EventService,
-        i18nService: I18nService, toasterService: ToasterService, private userService: UserService,
+        i18nService: I18nService, private userService: UserService,
         exportService: ExportService, platformUtilsService: PlatformUtilsService, private router: Router,
         logService: LogService, private userNamePipe: UserNamePipe) {
-        super(eventService, i18nService, toasterService, exportService, platformUtilsService, logService);
+        super(eventService, i18nService, exportService, platformUtilsService, logService);
     }
 
     async ngOnInit() {
diff --git a/src/app/organizations/manage/group-add-edit.component.ts b/src/app/organizations/manage/group-add-edit.component.ts
index 991e9744ea0..cd6be83a00e 100644
--- a/src/app/organizations/manage/group-add-edit.component.ts
+++ b/src/app/organizations/manage/group-add-edit.component.ts
@@ -6,8 +6,6 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CollectionService } from 'jslib-common/abstractions/collection.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
@@ -42,7 +40,7 @@ export class GroupAddEditComponent implements OnInit {
     deletePromise: Promise<any>;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private collectionService: CollectionService,
+        private collectionService: CollectionService,
         private platformUtilsService: PlatformUtilsService, private logService: LogService) { }
 
     async ngOnInit() {
@@ -112,7 +110,7 @@ export class GroupAddEditComponent implements OnInit {
                 this.formPromise = this.apiService.postGroup(this.organizationId, request);
             }
             await this.formPromise;
-            this.toasterService.popAsync('success', null,
+            this.platformUtilsService.showToast('success', null,
                 this.i18nService.t(this.editMode ? 'editedGroupId' : 'createdGroupId', this.name));
             this.onSavedGroup.emit();
         } catch (e) {
@@ -135,7 +133,7 @@ export class GroupAddEditComponent implements OnInit {
         try {
             this.deletePromise = this.apiService.deleteGroup(this.organizationId, this.groupId);
             await this.deletePromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('deletedGroupId', this.name));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('deletedGroupId', this.name));
             this.onDeletedGroup.emit();
         } catch (e) {
             this.logService.error(e);
diff --git a/src/app/organizations/manage/groups.component.ts b/src/app/organizations/manage/groups.component.ts
index 65ab870e115..6cbf75766ef 100644
--- a/src/app/organizations/manage/groups.component.ts
+++ b/src/app/organizations/manage/groups.component.ts
@@ -11,8 +11,6 @@ import {
 
 import { first } from 'rxjs/operators';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
@@ -50,7 +48,7 @@ export class GroupsComponent implements OnInit {
 
     constructor(private apiService: ApiService, private route: ActivatedRoute,
         private i18nService: I18nService, private modalService: ModalService,
-        private toasterService: ToasterService, private platformUtilsService: PlatformUtilsService,
+        private platformUtilsService: PlatformUtilsService,
         private userService: UserService, private router: Router,
         private searchService: SearchService, private logService: LogService) { }
 
@@ -123,7 +121,7 @@ export class GroupsComponent implements OnInit {
 
         try {
             await this.apiService.deleteGroup(this.organizationId, group.id);
-            this.toasterService.popAsync('success', null, this.i18nService.t('deletedGroupId', group.name));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('deletedGroupId', group.name));
             this.removeGroup(group);
         } catch (e) {
             this.logService.error(e);
diff --git a/src/app/organizations/manage/people.component.ts b/src/app/organizations/manage/people.component.ts
index 40a398c2f97..2c68cd5d4d3 100644
--- a/src/app/organizations/manage/people.component.ts
+++ b/src/app/organizations/manage/people.component.ts
@@ -12,8 +12,6 @@ import {
     Router,
 } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ValidationService } from 'jslib-angular/services/validation.service';
 
 import { ApiService } from 'jslib-common/abstractions/api.service';
@@ -82,12 +80,12 @@ export class PeopleComponent extends BasePeopleComponent<OrganizationUserUserDet
 
     constructor(apiService: ApiService, private route: ActivatedRoute,
         i18nService: I18nService, modalService: ModalService,
-        platformUtilsService: PlatformUtilsService, toasterService: ToasterService,
+        platformUtilsService: PlatformUtilsService,
         cryptoService: CryptoService, private userService: UserService, private router: Router,
         storageService: StorageService, searchService: SearchService,
         validationService: ValidationService, private policyService: PolicyService,
         logService: LogService, searchPipe: SearchPipe, userNamePipe: UserNamePipe, private syncService: SyncService) {
-            super(apiService, searchService, i18nService, platformUtilsService, toasterService, cryptoService,
+            super(apiService, searchService, i18nService, platformUtilsService, cryptoService,
                 storageService, validationService, modalService, logService, searchPipe, userNamePipe);
         }
 
@@ -239,7 +237,7 @@ export class PeopleComponent extends BasePeopleComponent<OrganizationUserUserDet
         const filteredUsers = users.filter(u => u.status === OrganizationUserStatusType.Invited);
 
         if (filteredUsers.length <= 0) {
-            this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
+            this.platformUtilsService.showToast('error', this.i18nService.t('errorOccurred'),
                 this.i18nService.t('noSelectedUsersApplicable'));
             return;
         }
diff --git a/src/app/organizations/manage/policy-edit.component.ts b/src/app/organizations/manage/policy-edit.component.ts
index c4105aaedc8..e9066cc8090 100644
--- a/src/app/organizations/manage/policy-edit.component.ts
+++ b/src/app/organizations/manage/policy-edit.component.ts
@@ -9,11 +9,10 @@ import {
     ViewContainerRef,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 
 import { PolicyType } from 'jslib-common/enums/policyType';
 
@@ -45,7 +44,7 @@ export class PolicyEditComponent {
     private policyResponse: PolicyResponse;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private componentFactoryResolver: ComponentFactoryResolver,
+        private platformUtilsService: PlatformUtilsService, private componentFactoryResolver: ComponentFactoryResolver,
         private cdr: ChangeDetectorRef, private logService: LogService) {
     }
 
@@ -78,14 +77,14 @@ export class PolicyEditComponent {
         try {
             request = await this.policyComponent.buildRequest(this.policiesEnabledMap);
         } catch (e) {
-            this.toasterService.pop('error', null, e);
+            this.platformUtilsService.showToast('error', null, e);
             return;
         }
 
         try {
             this.formPromise = this.apiService.putPolicy(this.organizationId, this.policy.type, request);
             await this.formPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('editedPolicyId', this.i18nService.t(this.policy.name)));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('editedPolicyId', this.i18nService.t(this.policy.name)));
             this.onSavedPolicy.emit();
         } catch (e) {
             this.logService.error(e);
diff --git a/src/app/organizations/manage/user-add-edit.component.ts b/src/app/organizations/manage/user-add-edit.component.ts
index 0ea8d609f6c..20a8b871090 100644
--- a/src/app/organizations/manage/user-add-edit.component.ts
+++ b/src/app/organizations/manage/user-add-edit.component.ts
@@ -6,8 +6,6 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CollectionService } from 'jslib-common/abstractions/collection.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
@@ -86,7 +84,7 @@ export class UserAddEditComponent implements OnInit {
     }
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private collectionService: CollectionService,
+        private collectionService: CollectionService,
         private platformUtilsService: PlatformUtilsService, private logService: LogService) { }
 
     async ngOnInit() {
@@ -181,7 +179,7 @@ export class UserAddEditComponent implements OnInit {
                 this.formPromise = this.apiService.postOrganizationUserInvite(this.organizationId, request);
             }
             await this.formPromise;
-            this.toasterService.popAsync('success', null,
+            this.platformUtilsService.showToast('success', null,
                 this.i18nService.t(this.editMode ? 'editedUserId' : 'invitedUsers', this.name));
             this.onSavedUser.emit();
         } catch (e) {
@@ -205,7 +203,7 @@ export class UserAddEditComponent implements OnInit {
         try {
             this.deletePromise = this.apiService.deleteOrganizationUser(this.organizationId, this.organizationUserId);
             await this.deletePromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('removedUserId', this.name));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('removedUserId', this.name));
             this.onDeletedUser.emit();
         } catch (e) {
             this.logService.error(e);
diff --git a/src/app/organizations/manage/user-groups.component.ts b/src/app/organizations/manage/user-groups.component.ts
index 5b71c59852e..98d2085cde7 100644
--- a/src/app/organizations/manage/user-groups.component.ts
+++ b/src/app/organizations/manage/user-groups.component.ts
@@ -6,11 +6,10 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 
 import { OrganizationUserUpdateGroupsRequest } from 'jslib-common/models/request/organizationUserUpdateGroupsRequest';
 import { GroupResponse } from 'jslib-common/models/response/groupResponse';
@@ -32,7 +31,7 @@ export class UserGroupsComponent implements OnInit {
     formPromise: Promise<any>;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private logService: LogService) { }
+        private platformUtilsService: PlatformUtilsService, private logService: LogService) { }
 
     async ngOnInit() {
         const groupsResponse = await this.apiService.getGroups(this.organizationId);
@@ -77,7 +76,7 @@ export class UserGroupsComponent implements OnInit {
             this.formPromise = this.apiService.putOrganizationUserGroups(this.organizationId, this.organizationUserId,
                 request);
             await this.formPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('editedGroupsForUser', this.name));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('editedGroupsForUser', this.name));
             this.onSavedUser.emit();
         } catch (e) {
             this.logService.error(e);
diff --git a/src/app/organizations/settings/account.component.ts b/src/app/organizations/settings/account.component.ts
index 03c2db8103e..49cebc0e4d8 100644
--- a/src/app/organizations/settings/account.component.ts
+++ b/src/app/organizations/settings/account.component.ts
@@ -9,7 +9,6 @@ import {
     Router
 } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
 import { ModalService } from 'jslib-angular/services/modal.service';
 
 import { ApiService } from 'jslib-common/abstractions/api.service';
@@ -52,7 +51,7 @@ export class AccountComponent {
 
     constructor(private modalService: ModalService,
         private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private route: ActivatedRoute,
+        private route: ActivatedRoute,
         private syncService: SyncService, private platformUtilsService: PlatformUtilsService,
         private cryptoService: CryptoService, private logService: LogService,
         private router: Router) { }
@@ -90,7 +89,7 @@ export class AccountComponent {
                 return this.syncService.fullSync(true);
             });
             await this.formPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('organizationUpdated'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('organizationUpdated'));
         } catch (e) {
             this.logService.error(e);
         }
@@ -99,7 +98,7 @@ export class AccountComponent {
     async submitTaxInfo() {
         this.taxFormPromise = this.taxInfo.submitTaxInfo();
         await this.taxFormPromise;
-        this.toasterService.popAsync('success', null, this.i18nService.t('taxInfoUpdated'));
+        this.platformUtilsService.showToast('success', null, this.i18nService.t('taxInfoUpdated'));
     }
 
     async deleteOrganization() {
diff --git a/src/app/organizations/settings/adjust-subscription.component.ts b/src/app/organizations/settings/adjust-subscription.component.ts
index 0a477f204e0..c84f6f72dfd 100644
--- a/src/app/organizations/settings/adjust-subscription.component.ts
+++ b/src/app/organizations/settings/adjust-subscription.component.ts
@@ -5,11 +5,10 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 
 import { OrganizationSubscriptionUpdateRequest } from 'jslib-common/models/request/organizationSubscriptionUpdateRequest';
 
@@ -31,7 +30,7 @@ export class AdjustSubscription {
     newMaxSeats: number;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private logService: LogService) { }
+        private platformUtilsService: PlatformUtilsService, private logService: LogService) { }
 
     ngOnInit() {
         this.limitSubscription = this.maxAutoscaleSeats != null;
@@ -47,7 +46,7 @@ export class AdjustSubscription {
 
             await this.formPromise;
 
-            this.toasterService.popAsync('success', null, this.i18nService.t('subscriptionUpdated'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('subscriptionUpdated'));
         } catch (e) {
             this.logService.error(e);
         }
diff --git a/src/app/organizations/settings/delete-organization.component.ts b/src/app/organizations/settings/delete-organization.component.ts
index a468c2e4485..98985ac707e 100644
--- a/src/app/organizations/settings/delete-organization.component.ts
+++ b/src/app/organizations/settings/delete-organization.component.ts
@@ -4,13 +4,12 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { Verification } from 'jslib-common/types/verification';
 
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { UserVerificationService } from 'jslib-common/abstractions/userVerification.service';
 
 @Component({
@@ -26,7 +25,7 @@ export class DeleteOrganizationComponent {
     formPromise: Promise<any>;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private userVerificationService: UserVerificationService,
+        private platformUtilsService: PlatformUtilsService, private userVerificationService: UserVerificationService,
         private logService: LogService) { }
 
     async submit() {
@@ -34,7 +33,7 @@ export class DeleteOrganizationComponent {
             this.formPromise = this.userVerificationService.buildRequest(this.masterPassword)
                 .then(request => this.apiService.deleteOrganization(this.organizationId, request));
             await this.formPromise;
-            this.toasterService.popAsync('success', this.i18nService.t('organizationDeleted'),
+            this.platformUtilsService.showToast('success', this.i18nService.t('organizationDeleted'),
                 this.i18nService.t('organizationDeletedDesc'));
             this.onSuccess.emit();
         } catch (e) {
diff --git a/src/app/organizations/settings/organization-billing.component.ts b/src/app/organizations/settings/organization-billing.component.ts
index 8666888c59d..5c278a056bd 100644
--- a/src/app/organizations/settings/organization-billing.component.ts
+++ b/src/app/organizations/settings/organization-billing.component.ts
@@ -4,8 +4,6 @@ import {
 } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
@@ -18,10 +16,10 @@ import { UserBillingComponent } from '../../settings/user-billing.component';
     templateUrl: '../../settings/user-billing.component.html',
 })
 export class OrganizationBillingComponent extends UserBillingComponent implements OnInit {
-    constructor(apiService: ApiService, i18nService: I18nService, toasterService: ToasterService,
+    constructor(apiService: ApiService, i18nService: I18nService,
         private route: ActivatedRoute, platformUtilsService: PlatformUtilsService,
         logService: LogService) {
-        super(apiService, i18nService, toasterService, platformUtilsService, logService);
+        super(apiService, i18nService, platformUtilsService, logService);
     }
 
     async ngOnInit() {
diff --git a/src/app/organizations/settings/organization-subscription.component.ts b/src/app/organizations/settings/organization-subscription.component.ts
index f8a15e62d62..dceeec7c3e7 100644
--- a/src/app/organizations/settings/organization-subscription.component.ts
+++ b/src/app/organizations/settings/organization-subscription.component.ts
@@ -3,7 +3,6 @@ import {
     OnInit,
 } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
-import { ToasterService } from 'angular2-toaster';
 
 import { Organization } from 'jslib-common/models/domain/organization';
 import { OrganizationSubscriptionResponse } from 'jslib-common/models/response/organizationSubscriptionResponse';
@@ -43,7 +42,7 @@ export class OrganizationSubscriptionComponent implements OnInit {
     reinstatePromise: Promise<any>;
 
     constructor(private apiService: ApiService, private platformUtilsService: PlatformUtilsService,
-        private i18nService: I18nService, private toasterService: ToasterService,
+        private i18nService: I18nService,
         private messagingService: MessagingService, private route: ActivatedRoute,
         private userService: UserService, private logService: LogService) {
         this.selfHosted = platformUtilsService.isSelfHost();
@@ -82,7 +81,7 @@ export class OrganizationSubscriptionComponent implements OnInit {
         try {
             this.reinstatePromise = this.apiService.postOrganizationReinstate(this.organizationId);
             await this.reinstatePromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('reinstated'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('reinstated'));
             this.load();
         } catch (e) {
             this.logService.error(e);
@@ -103,7 +102,7 @@ export class OrganizationSubscriptionComponent implements OnInit {
         try {
             this.cancelPromise = this.apiService.postOrganizationCancel(this.organizationId);
             await this.cancelPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('canceledSubscription'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('canceledSubscription'));
             this.load();
         } catch (e) {
             this.logService.error(e);
@@ -170,7 +169,7 @@ export class OrganizationSubscriptionComponent implements OnInit {
         try {
             this.removeSponsorshipPromise = this.apiService.deleteRemoveSponsorship(this.organizationId);
             await this.removeSponsorshipPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('removeSponsorshipSuccess'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('removeSponsorshipSuccess'));
             await this.load();
         } catch (e) {
             this.logService.error(e);
diff --git a/src/app/organizations/sponsorships/families-for-enterprise-setup.component.ts b/src/app/organizations/sponsorships/families-for-enterprise-setup.component.ts
index d8923a15dc8..aa19b8cd422 100644
--- a/src/app/organizations/sponsorships/families-for-enterprise-setup.component.ts
+++ b/src/app/organizations/sponsorships/families-for-enterprise-setup.component.ts
@@ -8,10 +8,6 @@ import {
     ActivatedRoute,
     Router,
 } from '@angular/router';
-import {
-    Toast,
-    ToasterService,
-} from 'angular2-toaster';
 
 import { first } from 'rxjs/operators';
 
@@ -33,6 +29,7 @@ import { OrganizationSponsorshipRedeemRequest } from 'jslib-common/models/reques
 
 import { DeleteOrganizationComponent } from 'src/app/organizations/settings/delete-organization.component';
 
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { OrganizationPlansComponent } from 'src/app/settings/organization-plans.component';
 
 @Component({
@@ -65,7 +62,7 @@ export class FamiliesForEnterpriseSetupComponent implements OnInit {
     _organizationPlansComponent: OrganizationPlansComponent;
     _selectedFamilyOrganizationId: string = '';
 
-    constructor(private router: Router, private toasterService: ToasterService,
+    constructor(private router: Router, private platformUtilsService: PlatformUtilsService,
         private i18nService: I18nService, private route: ActivatedRoute,
         private apiService: ApiService, private syncService: SyncService,
         private validationService: ValidationService, private userService: UserService,
@@ -76,13 +73,8 @@ export class FamiliesForEnterpriseSetupComponent implements OnInit {
         this.route.queryParams.pipe(first()).subscribe(async qParams => {
             const error = qParams.token == null;
             if (error) {
-                const toast: Toast = {
-                    type: 'error',
-                    title: null,
-                    body: this.i18nService.t('sponsoredFamiliesAcceptFailed'),
-                    timeout: 10000,
-                };
-                this.toasterService.popAsync(toast);
+                this.platformUtilsService.showToast('error', null, this.i18nService.t('sponsoredFamiliesAcceptFailed'),
+                    { timeout: 10000 });
                 this.router.navigate(['/']);
                 return;
             }
@@ -124,7 +116,7 @@ export class FamiliesForEnterpriseSetupComponent implements OnInit {
             request.sponsoredOrganizationId = organizationId;
 
             await this.apiService.postRedeemSponsorship(this.token, request);
-            this.toasterService.popAsync('success', null, this.i18nService.t('sponsoredFamiliesOfferRedeemed'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('sponsoredFamiliesOfferRedeemed'));
             await this.syncService.fullSync(true);
 
             this.router.navigate(['/']);
diff --git a/src/app/organizations/tools/exposed-passwords-report.component.ts b/src/app/organizations/tools/exposed-passwords-report.component.ts
index f49a11e241e..33e3aa695cc 100644
--- a/src/app/organizations/tools/exposed-passwords-report.component.ts
+++ b/src/app/organizations/tools/exposed-passwords-report.component.ts
@@ -30,10 +30,12 @@ export class ExposedPasswordsReportComponent extends BaseExposedPasswordsReportC
     }
 
     ngOnInit() {
+        const dynamicSuper = Object.getPrototypeOf(this.constructor.prototype);
         this.route.parent.parent.params.subscribe(async params => {
             this.organization = await this.userService.getOrganization(params.organizationId);
             this.manageableCiphers = await this.cipherService.getAll();
-            super.ngOnInit();
+            // TODO: We should do something about this, calling super in an async function is bad
+            dynamicSuper.ngOnInit();
         });
     }
 
diff --git a/src/app/organizations/tools/import.component.ts b/src/app/organizations/tools/import.component.ts
index 6e3d8655778..0d0a0cbb5c1 100644
--- a/src/app/organizations/tools/import.component.ts
+++ b/src/app/organizations/tools/import.component.ts
@@ -4,8 +4,6 @@ import {
     Router,
 } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { ImportService } from 'jslib-common/abstractions/import.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
@@ -22,11 +20,11 @@ import { ImportComponent as BaseImportComponent } from '../../tools/import.compo
 export class ImportComponent extends BaseImportComponent {
     organizationName: string;
 
-    constructor(i18nService: I18nService, toasterService: ToasterService,
+    constructor(i18nService: I18nService,
         importService: ImportService, router: Router, private route: ActivatedRoute,
         platformUtilsService: PlatformUtilsService, policyService: PolicyService,
         private userService: UserService, logService: LogService) {
-        super(i18nService, toasterService, importService, router, platformUtilsService, policyService, logService);
+        super(i18nService, importService, router, platformUtilsService, policyService, logService);
     }
 
     async ngOnInit() {
diff --git a/src/app/organizations/vault/ciphers.component.ts b/src/app/organizations/vault/ciphers.component.ts
index 5b87408bd46..05c832b8441 100644
--- a/src/app/organizations/vault/ciphers.component.ts
+++ b/src/app/organizations/vault/ciphers.component.ts
@@ -4,8 +4,6 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CipherService } from 'jslib-common/abstractions/cipher.service';
 import { EventService } from 'jslib-common/abstractions/event.service';
@@ -34,12 +32,12 @@ export class CiphersComponent extends BaseCiphersComponent {
 
     protected allCiphers: CipherView[] = [];
 
-    constructor(searchService: SearchService, toasterService: ToasterService, i18nService: I18nService,
+    constructor(searchService: SearchService, i18nService: I18nService,
         platformUtilsService: PlatformUtilsService, cipherService: CipherService,
         private apiService: ApiService, eventService: EventService, totpService: TotpService,
         userService: UserService, passwordRepromptService: PasswordRepromptService,
         logService: LogService) {
-        super(searchService, toasterService, i18nService, platformUtilsService, cipherService,
+        super(searchService, i18nService, platformUtilsService, cipherService,
             eventService, totpService, userService, passwordRepromptService, logService);
     }
 
diff --git a/src/app/oss.module.ts b/src/app/oss.module.ts
index 88790771feb..6b14f13db98 100644
--- a/src/app/oss.module.ts
+++ b/src/app/oss.module.ts
@@ -7,9 +7,8 @@ import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { RouterModule } from '@angular/router';
-
-import { ToasterModule } from 'angular2-toaster';
 import { InfiniteScrollModule } from 'ngx-infinite-scroll';
+import { ToastrModule } from 'ngx-toastr';
 
 import { NestedCheckboxComponent } from './components/nested-checkbox.component';
 import { PasswordRepromptComponent } from './components/password-reprompt.component';
@@ -181,6 +180,7 @@ import { ProvidersComponent } from './providers/providers.component';
 import { AvatarComponent } from 'jslib-angular/components/avatar.component';
 import { CalloutComponent } from 'jslib-angular/components/callout.component';
 import { IconComponent } from 'jslib-angular/components/icon.component';
+import { BitwardenToast } from 'jslib-angular/components/toastr.component';
 import { VerifyMasterPasswordComponent } from 'jslib-angular/components/verify-master-password.component';
 
 import { A11yTitleDirective } from 'jslib-angular/directives/a11y-title.directive';
@@ -295,7 +295,7 @@ registerLocaleData(localeZhTw, 'zh-TW');
         FormsModule,
         InfiniteScrollModule,
         DragDropModule,
-        ToasterModule.forChild(),
+        ToastrModule,
         ReactiveFormsModule,
         RouterModule,
     ],
diff --git a/src/app/services/organization-guard.service.ts b/src/app/services/organization-guard.service.ts
index c9ed989d528..6c12d27d540 100644
--- a/src/app/services/organization-guard.service.ts
+++ b/src/app/services/organization-guard.service.ts
@@ -5,15 +5,14 @@ import {
     Router,
 } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { UserService } from 'jslib-common/abstractions/user.service';
 
 @Injectable()
 export class OrganizationGuardService implements CanActivate {
     constructor(private userService: UserService, private router: Router,
-        private toasterService: ToasterService, private i18nService: I18nService) { }
+        private platformUtilsService: PlatformUtilsService, private i18nService: I18nService) { }
 
     async canActivate(route: ActivatedRouteSnapshot) {
         const org = await this.userService.getOrganization(route.params.organizationId);
@@ -22,7 +21,7 @@ export class OrganizationGuardService implements CanActivate {
             return false;
         }
         if (!org.isOwner && !org.enabled) {
-            this.toasterService.popAsync('error', null, this.i18nService.t('organizationIsDisabled'));
+            this.platformUtilsService.showToast('error', null, this.i18nService.t('organizationIsDisabled'));
             this.router.navigate(['/']);
             return false;
         }
diff --git a/src/app/services/services.module.ts b/src/app/services/services.module.ts
index 8c3c3176ef1..3de28cf67ad 100644
--- a/src/app/services/services.module.ts
+++ b/src/app/services/services.module.ts
@@ -3,7 +3,7 @@ import {
     Injector,
     NgModule,
 } from '@angular/core';
-import { ToasterModule } from 'angular2-toaster';
+import { ToastrModule } from 'ngx-toastr';
 
 import { BroadcasterMessagingService } from '../../services/broadcasterMessaging.service';
 import { HtmlStorageService } from '../../services/htmlStorage.service';
@@ -92,7 +92,7 @@ export function initFactory(window: Window, storageService: StorageServiceAbstra
 
 @NgModule({
     imports: [
-        ToasterModule,
+        ToastrModule,
         JslibServicesModule,
     ],
     declarations: [],
diff --git a/src/app/settings/adjust-payment.component.ts b/src/app/settings/adjust-payment.component.ts
index 3a48e819c7c..ebb26445ca5 100644
--- a/src/app/settings/adjust-payment.component.ts
+++ b/src/app/settings/adjust-payment.component.ts
@@ -6,11 +6,10 @@ import {
     ViewChild,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 
 import { PaymentRequest } from 'jslib-common/models/request/paymentRequest';
 
@@ -36,7 +35,7 @@ export class AdjustPaymentComponent {
     formPromise: Promise<any>;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private logService: LogService) { }
+        private platformUtilsService: PlatformUtilsService, private logService: LogService) { }
 
     async submit() {
         try {
@@ -59,7 +58,7 @@ export class AdjustPaymentComponent {
                 }
             });
             await this.formPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('updatedPaymentMethod'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('updatedPaymentMethod'));
             this.onAdjusted.emit();
         } catch (e) {
             this.logService.error(e);
diff --git a/src/app/settings/adjust-storage.component.ts b/src/app/settings/adjust-storage.component.ts
index d4aede056b7..bd622bca26b 100644
--- a/src/app/settings/adjust-storage.component.ts
+++ b/src/app/settings/adjust-storage.component.ts
@@ -11,11 +11,10 @@ import {
     Router,
 } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 
 import { StorageRequest } from 'jslib-common/models/request/storageRequest';
 
@@ -41,7 +40,7 @@ export class AdjustStorageComponent {
     formPromise: Promise<any>;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private router: Router,
+        private platformUtilsService: PlatformUtilsService, private router: Router,
         private activatedRoute: ActivatedRoute, private logService: LogService) { }
 
     async submit() {
@@ -73,14 +72,11 @@ export class AdjustStorageComponent {
             await this.formPromise;
             this.onAdjusted.emit(this.storageAdjustment);
             if (paymentFailed) {
-                this.toasterService.popAsync({
-                    body: this.i18nService.t('couldNotChargeCardPayInvoice'),
-                    type: 'warning',
-                    timeout: 10000,
-                });
+                this.platformUtilsService.showToast('warning', null,
+                    this.i18nService.t('couldNotChargeCardPayInvoice'), { timeout: 10000 });
                 this.router.navigate(['../billing'], { relativeTo: this.activatedRoute });
             } else {
-                this.toasterService.popAsync('success', null,
+                this.platformUtilsService.showToast('success', null,
                     this.i18nService.t('adjustedStorage', request.storageGbAdjustment.toString()));
             }
         } catch (e) {
diff --git a/src/app/settings/change-email.component.ts b/src/app/settings/change-email.component.ts
index 421c05b8067..9464e2afb58 100644
--- a/src/app/settings/change-email.component.ts
+++ b/src/app/settings/change-email.component.ts
@@ -3,13 +3,12 @@ import {
     OnInit,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CryptoService } from 'jslib-common/abstractions/crypto.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
 import { MessagingService } from 'jslib-common/abstractions/messaging.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { UserService } from 'jslib-common/abstractions/user.service';
 
 import { EmailRequest } from 'jslib-common/models/request/emailRequest';
@@ -31,7 +30,7 @@ export class ChangeEmailComponent implements OnInit {
     formPromise: Promise<any>;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private cryptoService: CryptoService,
+        private platformUtilsService: PlatformUtilsService, private cryptoService: CryptoService,
         private messagingService: MessagingService, private userService: UserService,
         private logService: LogService) { }
 
@@ -44,7 +43,7 @@ export class ChangeEmailComponent implements OnInit {
     async submit() {
         const hasEncKey = await this.cryptoService.hasEncKey();
         if (!hasEncKey) {
-            this.toasterService.popAsync('error', null, this.i18nService.t('updateKey'));
+            this.platformUtilsService.showToast('error', null, this.i18nService.t('updateKey'));
             return;
         }
 
@@ -75,7 +74,7 @@ export class ChangeEmailComponent implements OnInit {
                 this.formPromise = this.apiService.postEmail(request);
                 await this.formPromise;
                 this.reset();
-                this.toasterService.popAsync('success', this.i18nService.t('emailChanged'),
+                this.platformUtilsService.showToast('success', this.i18nService.t('emailChanged'),
                     this.i18nService.t('logBackIn'));
                 this.messagingService.send('logout');
             } catch (e) {
diff --git a/src/app/settings/change-kdf.component.ts b/src/app/settings/change-kdf.component.ts
index 94227a3fc90..f95329e59f8 100644
--- a/src/app/settings/change-kdf.component.ts
+++ b/src/app/settings/change-kdf.component.ts
@@ -3,13 +3,12 @@ import {
     OnInit,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CryptoService } from 'jslib-common/abstractions/crypto.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
 import { MessagingService } from 'jslib-common/abstractions/messaging.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { UserService } from 'jslib-common/abstractions/user.service';
 
 import { KdfRequest } from 'jslib-common/models/request/kdfRequest';
@@ -28,7 +27,7 @@ export class ChangeKdfComponent implements OnInit {
     formPromise: Promise<any>;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private cryptoService: CryptoService,
+        private platformUtilsService: PlatformUtilsService, private cryptoService: CryptoService,
         private messagingService: MessagingService, private userService: UserService,
         private logService: LogService) {
         this.kdfOptions = [
@@ -44,7 +43,7 @@ export class ChangeKdfComponent implements OnInit {
     async submit() {
         const hasEncKey = await this.cryptoService.hasEncKey();
         if (!hasEncKey) {
-            this.toasterService.popAsync('error', null, this.i18nService.t('updateKey'));
+            this.platformUtilsService.showToast('error', null, this.i18nService.t('updateKey'));
             return;
         }
 
@@ -60,7 +59,7 @@ export class ChangeKdfComponent implements OnInit {
         try {
             this.formPromise = this.apiService.postAccountKdf(request);
             await this.formPromise;
-            this.toasterService.popAsync('success', this.i18nService.t('encKeySettingsChanged'),
+            this.platformUtilsService.showToast('success', this.i18nService.t('encKeySettingsChanged'),
                 this.i18nService.t('logBackIn'));
             this.messagingService.send('logout');
         } catch (e) {
diff --git a/src/app/settings/deauthorize-sessions.component.ts b/src/app/settings/deauthorize-sessions.component.ts
index 05301f49f91..4efb61dd146 100644
--- a/src/app/settings/deauthorize-sessions.component.ts
+++ b/src/app/settings/deauthorize-sessions.component.ts
@@ -1,11 +1,10 @@
 import { Component } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
 import { MessagingService } from 'jslib-common/abstractions/messaging.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { UserVerificationService } from 'jslib-common/abstractions/userVerification.service';
 
 import { Verification } from 'jslib-common/types/verification';
@@ -19,7 +18,7 @@ export class DeauthorizeSessionsComponent {
     formPromise: Promise<any>;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private userVerificationService: UserVerificationService,
+        private platformUtilsService: PlatformUtilsService, private userVerificationService: UserVerificationService,
         private messagingService: MessagingService, private logService: LogService) { }
 
     async submit() {
@@ -27,7 +26,7 @@ export class DeauthorizeSessionsComponent {
             this.formPromise = this.userVerificationService.buildRequest(this.masterPassword)
                 .then(request => this.apiService.postSecurityStamp(request));
             await this.formPromise;
-            this.toasterService.popAsync('success', this.i18nService.t('sessionsDeauthorized'),
+            this.platformUtilsService.showToast('success', this.i18nService.t('sessionsDeauthorized'),
                 this.i18nService.t('logBackIn'));
             this.messagingService.send('logout');
         } catch (e) {
diff --git a/src/app/settings/delete-account.component.ts b/src/app/settings/delete-account.component.ts
index af4890821ab..6f3ff68785c 100644
--- a/src/app/settings/delete-account.component.ts
+++ b/src/app/settings/delete-account.component.ts
@@ -1,11 +1,10 @@
 import { Component } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
 import { MessagingService } from 'jslib-common/abstractions/messaging.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { UserVerificationService } from 'jslib-common/abstractions/userVerification.service';
 
 import { Verification } from 'jslib-common/types/verification';
@@ -19,7 +18,7 @@ export class DeleteAccountComponent {
     formPromise: Promise<any>;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private userVerificationService: UserVerificationService,
+        private platformUtilsService: PlatformUtilsService, private userVerificationService: UserVerificationService,
         private messagingService: MessagingService, private logService: LogService) { }
 
     async submit() {
@@ -27,7 +26,7 @@ export class DeleteAccountComponent {
             this.formPromise = this.userVerificationService.buildRequest(this.masterPassword)
                 .then(request => this.apiService.deleteAccount(request));
             await this.formPromise;
-            this.toasterService.popAsync('success', this.i18nService.t('accountDeleted'),
+            this.platformUtilsService.showToast('success', this.i18nService.t('accountDeleted'),
                 this.i18nService.t('accountDeletedDesc'));
             this.messagingService.send('logout');
         } catch (e) {
diff --git a/src/app/settings/domain-rules.component.ts b/src/app/settings/domain-rules.component.ts
index 8e0c8b405a8..d42ae2cb928 100644
--- a/src/app/settings/domain-rules.component.ts
+++ b/src/app/settings/domain-rules.component.ts
@@ -3,11 +3,10 @@ import {
     OnInit,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 
 import { UpdateDomainsRequest } from 'jslib-common/models/request/updateDomainsRequest';
 
@@ -22,7 +21,7 @@ export class DomainRulesComponent implements OnInit {
     formPromise: Promise<any>;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private logService: LogService) { }
+        private platformUtilsService: PlatformUtilsService, private logService: LogService) { }
 
     async ngOnInit() {
         const response = await this.apiService.getSettingsDomains();
@@ -74,7 +73,7 @@ export class DomainRulesComponent implements OnInit {
         try {
             this.formPromise = this.apiService.putSettingsDomains(request);
             await this.formPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('domainsUpdated'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('domainsUpdated'));
         } catch (e) {
             this.logService.error(e);
         }
diff --git a/src/app/settings/emergency-access-add-edit.component.ts b/src/app/settings/emergency-access-add-edit.component.ts
index 53417ef2cb0..a117a1dc8c5 100644
--- a/src/app/settings/emergency-access-add-edit.component.ts
+++ b/src/app/settings/emergency-access-add-edit.component.ts
@@ -6,11 +6,10 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 
 import { EmergencyAccessType } from 'jslib-common/enums/emergencyAccessType';
 import { EmergencyAccessInviteRequest } from 'jslib-common/models/request/emergencyAccessInviteRequest';
@@ -40,7 +39,7 @@ export class EmergencyAccessAddEditComponent implements OnInit {
     waitTime: number;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private logService: LogService) { }
+        private platformUtilsService: PlatformUtilsService, private logService: LogService) { }
 
     async ngOnInit() {
         this.editMode = this.loading = this.emergencyAccessId != null;
@@ -90,7 +89,7 @@ export class EmergencyAccessAddEditComponent implements OnInit {
             }
 
             await this.formPromise;
-            this.toasterService.popAsync('success', null,
+            this.platformUtilsService.showToast('success', null,
                 this.i18nService.t(this.editMode ? 'editedUserId' : 'invitedUsers', this.name));
             this.onSaved.emit();
         } catch (e) {
diff --git a/src/app/settings/emergency-access-takeover.component.ts b/src/app/settings/emergency-access-takeover.component.ts
index 3875f040b21..342c2d48cf4 100644
--- a/src/app/settings/emergency-access-takeover.component.ts
+++ b/src/app/settings/emergency-access-takeover.component.ts
@@ -6,8 +6,6 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CryptoService } from 'jslib-common/abstractions/crypto.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
@@ -45,7 +43,7 @@ export class EmergencyAccessTakeoverComponent extends ChangePasswordComponent im
         messagingService: MessagingService, userService: UserService,
         passwordGenerationService: PasswordGenerationService,
         platformUtilsService: PlatformUtilsService, policyService: PolicyService,
-        private apiService: ApiService, private toasterService: ToasterService, private logService: LogService) {
+        private apiService: ApiService, private logService: LogService) {
         super(i18nService, cryptoService, messagingService, userService, passwordGenerationService,
             platformUtilsService, policyService);
     }
@@ -69,7 +67,7 @@ export class EmergencyAccessTakeoverComponent extends ChangePasswordComponent im
         const oldEncKey = new SymmetricCryptoKey(oldKeyBuffer);
 
         if (oldEncKey == null) {
-            this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'), this.i18nService.t('unexpectedError'));
+            this.platformUtilsService.showToast('error', this.i18nService.t('errorOccurred'), this.i18nService.t('unexpectedError'));
             return;
         }
 
diff --git a/src/app/settings/emergency-access.component.ts b/src/app/settings/emergency-access.component.ts
index de88015b124..5310716ac47 100644
--- a/src/app/settings/emergency-access.component.ts
+++ b/src/app/settings/emergency-access.component.ts
@@ -4,7 +4,6 @@ import {
     ViewChild,
     ViewContainerRef
 } from '@angular/core';
-import { ToasterService } from 'angular2-toaster';
 
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CryptoService } from 'jslib-common/abstractions/crypto.service';
@@ -49,7 +48,7 @@ export class EmergencyAccessComponent implements OnInit {
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
         private modalService: ModalService, private platformUtilsService: PlatformUtilsService,
-        private toasterService: ToasterService, private cryptoService: CryptoService,
+        private cryptoService: CryptoService,
         private storageService: StorageService, private userService: UserService,
         private messagingService: MessagingService, private userNamePipe: UserNamePipe,
         private logService: LogService) { }
@@ -99,7 +98,7 @@ export class EmergencyAccessComponent implements OnInit {
         }
         this.actionPromise = this.apiService.postEmergencyAccessReinvite(contact.id);
         await this.actionPromise;
-        this.toasterService.popAsync('success', null, this.i18nService.t('hasBeenReinvited', contact.email));
+        this.platformUtilsService.showToast('success', null, this.i18nService.t('hasBeenReinvited', contact.email));
         this.actionPromise = null;
     }
 
@@ -125,7 +124,7 @@ export class EmergencyAccessComponent implements OnInit {
                     await comp.formPromise;
 
                     updateUser();
-                    this.toasterService.popAsync('success', null, this.i18nService.t('hasBeenConfirmed', this.userNamePipe.transform(contact)));
+                    this.platformUtilsService.showToast('success', null, this.i18nService.t('hasBeenConfirmed', this.userNamePipe.transform(contact)));
                 });
             });
             return;
@@ -135,7 +134,7 @@ export class EmergencyAccessComponent implements OnInit {
         await this.actionPromise;
         updateUser();
 
-        this.toasterService.popAsync('success', null, this.i18nService.t('hasBeenConfirmed', this.userNamePipe.transform(contact)));
+        this.platformUtilsService.showToast('success', null, this.i18nService.t('hasBeenConfirmed', this.userNamePipe.transform(contact)));
         this.actionPromise = null;
     }
 
@@ -149,7 +148,7 @@ export class EmergencyAccessComponent implements OnInit {
 
         try {
             await this.apiService.deleteEmergencyAccess(details.id);
-            this.toasterService.popAsync('success', null, this.i18nService.t('removedUserId', this.userNamePipe.transform(details)));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('removedUserId', this.userNamePipe.transform(details)));
 
             if (details instanceof EmergencyAccessGranteeDetailsResponse) {
                 this.removeGrantee(details);
@@ -177,7 +176,7 @@ export class EmergencyAccessComponent implements OnInit {
         await this.apiService.postEmergencyAccessInitiate(details.id);
 
         details.status = EmergencyAccessStatusType.RecoveryInitiated;
-        this.toasterService.popAsync('success', null, this.i18nService.t('requestSent', this.userNamePipe.transform(details)));
+        this.platformUtilsService.showToast('success', null, this.i18nService.t('requestSent', this.userNamePipe.transform(details)));
     }
 
     async approve(details: EmergencyAccessGranteeDetailsResponse) {
@@ -198,14 +197,14 @@ export class EmergencyAccessComponent implements OnInit {
         await this.apiService.postEmergencyAccessApprove(details.id);
         details.status = EmergencyAccessStatusType.RecoveryApproved;
 
-        this.toasterService.popAsync('success', null, this.i18nService.t('emergencyApproved', this.userNamePipe.transform(details)));
+        this.platformUtilsService.showToast('success', null, this.i18nService.t('emergencyApproved', this.userNamePipe.transform(details)));
     }
 
     async reject(details: EmergencyAccessGranteeDetailsResponse) {
         await this.apiService.postEmergencyAccessReject(details.id);
         details.status = EmergencyAccessStatusType.Confirmed;
 
-        this.toasterService.popAsync('success', null, this.i18nService.t('emergencyRejected', this.userNamePipe.transform(details)));
+        this.platformUtilsService.showToast('success', null, this.i18nService.t('emergencyRejected', this.userNamePipe.transform(details)));
     }
 
     async takeover(details: EmergencyAccessGrantorDetailsResponse) {
@@ -216,7 +215,7 @@ export class EmergencyAccessComponent implements OnInit {
 
             comp.onDone.subscribe(() => {
                 modal.close();
-                this.toasterService.popAsync('success', null, this.i18nService.t('passwordResetFor', this.userNamePipe.transform(details)));
+                this.platformUtilsService.showToast('success', null, this.i18nService.t('passwordResetFor', this.userNamePipe.transform(details)));
             });
         });
     }
diff --git a/src/app/settings/options.component.ts b/src/app/settings/options.component.ts
index b218cf81a66..e4dd01c013e 100644
--- a/src/app/settings/options.component.ts
+++ b/src/app/settings/options.component.ts
@@ -4,8 +4,6 @@ import {
 } from '@angular/core';
 import { FormControl } from '@angular/forms';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { MessagingService } from 'jslib-common/abstractions/messaging.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
@@ -39,7 +37,7 @@ export class OptionsComponent implements OnInit {
     private startingTheme: string;
 
     constructor(private storageService: StorageService, private stateService: StateService,
-        private i18nService: I18nService, private toasterService: ToasterService,
+        private i18nService: I18nService,
         private vaultTimeoutService: VaultTimeoutService, private platformUtilsService: PlatformUtilsService,
         private messagingService: MessagingService) {
         this.vaultTimeouts = [
@@ -85,7 +83,7 @@ export class OptionsComponent implements OnInit {
 
     async submit() {
         if (!this.vaultTimeout.valid) {
-            this.toasterService.popAsync('error', null, this.i18nService.t('vaultTimeoutToLarge'));
+            this.platformUtilsService.showToast('error', null, this.i18nService.t('vaultTimeoutToLarge'));
             return;
         }
 
@@ -108,7 +106,7 @@ export class OptionsComponent implements OnInit {
         if (this.locale !== this.startingLocale) {
             window.location.reload();
         } else {
-            this.toasterService.popAsync('success', null, this.i18nService.t('optionsUpdated'));
+            this.platformUtilsService.showToast('success', null, [this.i18nService.t('optionsUpdated'), this.i18nService.t('optionsUpdated')]);
         }
     }
 
diff --git a/src/app/settings/organization-plans.component.ts b/src/app/settings/organization-plans.component.ts
index 52c44c5423a..60ccf461fd6 100644
--- a/src/app/settings/organization-plans.component.ts
+++ b/src/app/settings/organization-plans.component.ts
@@ -8,8 +8,6 @@ import {
 } from '@angular/core';
 import { Router } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CryptoService } from 'jslib-common/abstractions/crypto.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
@@ -73,7 +71,7 @@ export class OrganizationPlansComponent implements OnInit {
     plans: PlanResponse[];
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, platformUtilsService: PlatformUtilsService,
+        private platformUtilsService: PlatformUtilsService,
         private cryptoService: CryptoService, private router: Router, private syncService: SyncService,
         private policyService: PolicyService, private userService: UserService, private logService: LogService) {
         this.selfHosted = platformUtilsService.isSelfHost();
@@ -271,10 +269,10 @@ export class OrganizationPlansComponent implements OnInit {
                         orgId = await this.createCloudHosted(key, collectionCt, orgKeys, shareKey[1]);
                     }
 
-                    this.toasterService.popAsync('success', this.i18nService.t('organizationCreated'), this.i18nService.t('organizationReadyToGo'));
+                    this.platformUtilsService.showToast('success', this.i18nService.t('organizationCreated'), this.i18nService.t('organizationReadyToGo'));
                 } else {
                     orgId = await this.updateOrganization(orgId);
-                    this.toasterService.popAsync('success', null, this.i18nService.t('organizationUpgraded'));
+                    this.platformUtilsService.showToast('success', null, this.i18nService.t('organizationUpgraded'));
                 }
 
                 await this.apiService.refreshIdentityToken();
diff --git a/src/app/settings/organizations.component.ts b/src/app/settings/organizations.component.ts
index 1d893e4146a..44f6b81a6e6 100644
--- a/src/app/settings/organizations.component.ts
+++ b/src/app/settings/organizations.component.ts
@@ -4,8 +4,6 @@ import {
     OnInit,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CryptoService } from 'jslib-common/abstractions/crypto.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
@@ -38,7 +36,7 @@ export class OrganizationsComponent implements OnInit {
 
     constructor(private userService: UserService, private platformUtilsService: PlatformUtilsService,
         private i18nService: I18nService, private apiService: ApiService,
-        private toasterService: ToasterService, private syncService: SyncService,
+        private syncService: SyncService,
         private cryptoService: CryptoService, private policyService: PolicyService,
         private logService: LogService) { }
 
@@ -85,7 +83,7 @@ export class OrganizationsComponent implements OnInit {
                 return this.syncService.fullSync(true);
             });
             await this.actionPromise;
-            this.toasterService.popAsync('success', null, 'Unlinked SSO');
+            this.platformUtilsService.showToast('success', null, 'Unlinked SSO');
             await this.load();
         } catch (e) {
             this.logService.error(e);
@@ -105,7 +103,7 @@ export class OrganizationsComponent implements OnInit {
                 return this.syncService.fullSync(true);
             });
             await this.actionPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('leftOrganization'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('leftOrganization'));
             await this.load();
         } catch (e) {
             this.logService.error(e);
diff --git a/src/app/settings/premium.component.ts b/src/app/settings/premium.component.ts
index 089b08b43dc..fc66df02954 100644
--- a/src/app/settings/premium.component.ts
+++ b/src/app/settings/premium.component.ts
@@ -5,8 +5,6 @@ import {
 } from '@angular/core';
 import { Router } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
@@ -36,7 +34,7 @@ export class PremiumComponent implements OnInit {
     formPromise: Promise<any>;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, platformUtilsService: PlatformUtilsService,
+        private platformUtilsService: PlatformUtilsService,
         private tokenService: TokenService, private router: Router,
         private messagingService: MessagingService, private syncService: SyncService,
         private userService: UserService, private logService: LogService) {
@@ -58,7 +56,7 @@ export class PremiumComponent implements OnInit {
             const fileEl = document.getElementById('file') as HTMLInputElement;
             files = fileEl.files;
             if (files == null || files.length === 0) {
-                this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
+                this.platformUtilsService.showToast('error', this.i18nService.t('errorOccurred'),
                     this.i18nService.t('selectFile'));
                 return;
             }
@@ -67,7 +65,7 @@ export class PremiumComponent implements OnInit {
         try {
             if (this.selfHosted) {
                 if (!this.tokenService.getEmailVerified()) {
-                    this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
+                    this.platformUtilsService.showToast('error', this.i18nService.t('errorOccurred'),
                         this.i18nService.t('verifyEmailFirst'));
                     return;
                 }
@@ -106,7 +104,7 @@ export class PremiumComponent implements OnInit {
     async finalizePremium() {
         await this.apiService.refreshIdentityToken();
         await this.syncService.fullSync(true);
-        this.toasterService.popAsync('success', null, this.i18nService.t('premiumUpdated'));
+        this.platformUtilsService.showToast('success', null, this.i18nService.t('premiumUpdated'));
         this.messagingService.send('purchasedPremium');
         this.router.navigate(['/settings/subscription']);
     }
diff --git a/src/app/settings/profile.component.ts b/src/app/settings/profile.component.ts
index 49c713d7746..afc6e980518 100644
--- a/src/app/settings/profile.component.ts
+++ b/src/app/settings/profile.component.ts
@@ -3,13 +3,12 @@ import {
     OnInit,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CryptoService } from 'jslib-common/abstractions/crypto.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { KeyConnectorService } from 'jslib-common/abstractions/keyConnector.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { UserService } from 'jslib-common/abstractions/user.service';
 
 import { UpdateProfileRequest } from 'jslib-common/models/request/updateProfileRequest';
@@ -29,7 +28,7 @@ export class ProfileComponent implements OnInit {
     formPromise: Promise<any>;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private userService: UserService,
+        private platformUtilsService: PlatformUtilsService, private userService: UserService,
         private cryptoService: CryptoService, private logService: LogService,
         private keyConnectorService: KeyConnectorService) { }
 
@@ -48,7 +47,7 @@ export class ProfileComponent implements OnInit {
             const request = new UpdateProfileRequest(this.profile.name, this.profile.masterPasswordHint);
             this.formPromise = this.apiService.putProfile(request);
             await this.formPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('accountUpdated'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('accountUpdated'));
         } catch (e) {
             this.logService.error(e);
         }
diff --git a/src/app/settings/purge-vault.component.ts b/src/app/settings/purge-vault.component.ts
index 14c9f9c8d72..b6a999345cd 100644
--- a/src/app/settings/purge-vault.component.ts
+++ b/src/app/settings/purge-vault.component.ts
@@ -4,11 +4,10 @@ import {
 } from '@angular/core';
 import { Router } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { UserVerificationService } from 'jslib-common/abstractions/userVerification.service';
 
 import { Verification } from 'jslib-common/types/verification';
@@ -24,7 +23,7 @@ export class PurgeVaultComponent {
     formPromise: Promise<any>;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private userVerificationService: UserVerificationService,
+        private platformUtilsService: PlatformUtilsService, private userVerificationService: UserVerificationService,
         private router: Router, private logService: LogService) { }
 
     async submit() {
@@ -32,7 +31,7 @@ export class PurgeVaultComponent {
             this.formPromise = this.userVerificationService.buildRequest(this.masterPassword)
                 .then(request => this.apiService.postPurgeCiphers(request, this.organizationId));
             await this.formPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('vaultPurged'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('vaultPurged'));
             if (this.organizationId != null) {
                 this.router.navigate(['organizations', this.organizationId, 'vault']);
             } else {
diff --git a/src/app/settings/sponsored-families.component.ts b/src/app/settings/sponsored-families.component.ts
index afa45bd31ea..57071c0a358 100644
--- a/src/app/settings/sponsored-families.component.ts
+++ b/src/app/settings/sponsored-families.component.ts
@@ -2,11 +2,12 @@ import {
     Component,
     OnInit,
 } from '@angular/core';
-import { ToasterService } from 'angular2-toaster';
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { SyncService } from 'jslib-common/abstractions/sync.service';
 import { UserService } from 'jslib-common/abstractions/user.service';
+
 import { PlanSponsorshipType } from 'jslib-common/enums/planSponsorshipType';
 import { Organization } from 'jslib-common/models/domain/organization';
 
@@ -26,7 +27,7 @@ export class SponsoredFamiliesComponent implements OnInit {
     formPromise: Promise<any>;
 
     constructor(private userService: UserService, private apiService: ApiService,
-        private i18nService: I18nService, private toasterService: ToasterService,
+        private i18nService: I18nService, private platformUtilsService: PlatformUtilsService,
         private syncService: SyncService) { }
 
     async ngOnInit() {
@@ -41,7 +42,7 @@ export class SponsoredFamiliesComponent implements OnInit {
         });
 
         await this.formPromise;
-        this.toasterService.popAsync('success', null, this.i18nService.t('sponsorshipCreated'));
+        this.platformUtilsService.showToast('success', null, this.i18nService.t('sponsorshipCreated'));
         this.formPromise = null;
         this.resetForm();
         await this.load(true);
diff --git a/src/app/settings/sponsoring-org-row.component.ts b/src/app/settings/sponsoring-org-row.component.ts
index c5ed67bd18f..f656a239b74 100644
--- a/src/app/settings/sponsoring-org-row.component.ts
+++ b/src/app/settings/sponsoring-org-row.component.ts
@@ -4,7 +4,6 @@ import {
     Input,
     Output,
 } from '@angular/core';
-import { ToasterService } from 'angular2-toaster';
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
@@ -24,7 +23,7 @@ export class SponsoringOrgRowComponent {
     revokeSponsorshipPromise: Promise<any>;
     resendEmailPromise: Promise<any>;
 
-    constructor(private toasterService: ToasterService, private apiService: ApiService,
+    constructor(private apiService: ApiService,
         private i18nService: I18nService, private logService: LogService,
         private platformUtilsService: PlatformUtilsService) { }
 
@@ -42,7 +41,7 @@ export class SponsoringOrgRowComponent {
     async resendEmail() {
         this.resendEmailPromise = this.apiService.postResendSponsorshipOffer(this.sponsoringOrg.id);
         await this.resendEmailPromise;
-        this.toasterService.popAsync('success', null, this.i18nService.t('emailSent'));
+        this.platformUtilsService.showToast('success', null, this.i18nService.t('emailSent'));
         this.resendEmailPromise = null;
     }
 
@@ -57,7 +56,7 @@ export class SponsoringOrgRowComponent {
         }
 
         await this.apiService.deleteRevokeSponsorship(this.sponsoringOrg.id);
-        this.toasterService.popAsync('success', null, this.i18nService.t('reclaimedFreePlan'));
+        this.platformUtilsService.showToast('success', null, this.i18nService.t('reclaimedFreePlan'));
         this.sponsorshipRemoved.emit();
     }
 }
diff --git a/src/app/settings/two-factor-authenticator.component.ts b/src/app/settings/two-factor-authenticator.component.ts
index 6010b85406c..b8582d289b7 100644
--- a/src/app/settings/two-factor-authenticator.component.ts
+++ b/src/app/settings/two-factor-authenticator.component.ts
@@ -4,8 +4,6 @@ import {
     OnInit,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
@@ -33,10 +31,10 @@ export class TwoFactorAuthenticatorComponent extends TwoFactorBaseComponent impl
     private qrScript: HTMLScriptElement;
 
     constructor(apiService: ApiService, i18nService: I18nService,
-        toasterService: ToasterService, userVerificationService: UserVerificationService,
+        userVerificationService: UserVerificationService,
         platformUtilsService: PlatformUtilsService, logService: LogService,
         private userService: UserService) {
-        super(apiService, i18nService, toasterService, platformUtilsService, logService, userVerificationService);
+        super(apiService, i18nService, platformUtilsService, logService, userVerificationService);
         this.qrScript = window.document.createElement('script');
         this.qrScript.src = 'scripts/qrious.min.js';
         this.qrScript.async = true;
diff --git a/src/app/settings/two-factor-base.component.ts b/src/app/settings/two-factor-base.component.ts
index 8544ab8fdc6..fd9bef04248 100644
--- a/src/app/settings/two-factor-base.component.ts
+++ b/src/app/settings/two-factor-base.component.ts
@@ -4,8 +4,6 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
@@ -32,7 +30,7 @@ export abstract class TwoFactorBaseComponent {
     protected verificationType: VerificationType;
 
     constructor(protected apiService: ApiService, protected i18nService: I18nService,
-        protected toasterService: ToasterService, protected platformUtilsService: PlatformUtilsService,
+        protected platformUtilsService: PlatformUtilsService,
         protected logService: LogService, protected userVerificationService: UserVerificationService) { }
 
     protected auth(authResponse: any) {
@@ -67,7 +65,7 @@ export abstract class TwoFactorBaseComponent {
             }
             await promise;
             this.enabled = false;
-            this.toasterService.popAsync('success', null, this.i18nService.t('twoStepDisabled'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('twoStepDisabled'));
             this.onUpdated.emit(false);
         }  catch (e) {
             this.logService.error(e);
diff --git a/src/app/settings/two-factor-duo.component.ts b/src/app/settings/two-factor-duo.component.ts
index acce4cf59e0..e38cf1763f0 100644
--- a/src/app/settings/two-factor-duo.component.ts
+++ b/src/app/settings/two-factor-duo.component.ts
@@ -1,7 +1,5 @@
 import { Component } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
@@ -26,9 +24,9 @@ export class TwoFactorDuoComponent extends TwoFactorBaseComponent {
     formPromise: Promise<any>;
 
     constructor(apiService: ApiService, i18nService: I18nService,
-        toasterService: ToasterService, platformUtilsService: PlatformUtilsService,
+        platformUtilsService: PlatformUtilsService,
         logService: LogService, userVerificationService: UserVerificationService) {
-        super(apiService, i18nService, toasterService, platformUtilsService, logService, userVerificationService);
+        super(apiService, i18nService, platformUtilsService, logService, userVerificationService);
     }
 
     auth(authResponse: any) {
diff --git a/src/app/settings/two-factor-email.component.ts b/src/app/settings/two-factor-email.component.ts
index 8e5ad39afca..60f633cca46 100644
--- a/src/app/settings/two-factor-email.component.ts
+++ b/src/app/settings/two-factor-email.component.ts
@@ -1,7 +1,5 @@
 import { Component } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
@@ -30,10 +28,10 @@ export class TwoFactorEmailComponent extends TwoFactorBaseComponent {
     emailPromise: Promise<any>;
 
     constructor(apiService: ApiService, i18nService: I18nService,
-        toasterService: ToasterService, platformUtilsService: PlatformUtilsService,
+        platformUtilsService: PlatformUtilsService,
         logService: LogService, userVerificationService: UserVerificationService,
         private userService: UserService) {
-        super(apiService, i18nService, toasterService, platformUtilsService, logService, userVerificationService);
+        super(apiService, i18nService, platformUtilsService, logService, userVerificationService);
     }
 
     auth(authResponse: any) {
diff --git a/src/app/settings/two-factor-webauthn.component.ts b/src/app/settings/two-factor-webauthn.component.ts
index 1246e179ccc..f7e42a247db 100644
--- a/src/app/settings/two-factor-webauthn.component.ts
+++ b/src/app/settings/two-factor-webauthn.component.ts
@@ -3,8 +3,6 @@ import {
     NgZone,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
@@ -40,9 +38,9 @@ export class TwoFactorWebAuthnComponent extends TwoFactorBaseComponent {
     formPromise: Promise<any>;
 
     constructor(apiService: ApiService, i18nService: I18nService,
-        toasterService: ToasterService, platformUtilsService: PlatformUtilsService,
+        platformUtilsService: PlatformUtilsService,
         private ngZone: NgZone, logService: LogService, userVerificationService: UserVerificationService) {
-        super(apiService, i18nService, toasterService, platformUtilsService, logService, userVerificationService);
+        super(apiService, i18nService, platformUtilsService, logService, userVerificationService);
     }
 
     auth(authResponse: any) {
diff --git a/src/app/settings/two-factor-yubikey.component.ts b/src/app/settings/two-factor-yubikey.component.ts
index a655981e4ef..a888cf262be 100644
--- a/src/app/settings/two-factor-yubikey.component.ts
+++ b/src/app/settings/two-factor-yubikey.component.ts
@@ -1,7 +1,5 @@
 import { Component } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
@@ -28,9 +26,9 @@ export class TwoFactorYubiKeyComponent extends TwoFactorBaseComponent {
     disablePromise: Promise<any>;
 
     constructor(apiService: ApiService, i18nService: I18nService,
-        toasterService: ToasterService, platformUtilsService: PlatformUtilsService,
+        platformUtilsService: PlatformUtilsService,
         logService: LogService, userVerificationService: UserVerificationService) {
-        super(apiService, i18nService, toasterService, platformUtilsService, logService, userVerificationService);
+        super(apiService, i18nService, platformUtilsService, logService, userVerificationService);
     }
 
     auth(authResponse: any) {
@@ -51,7 +49,7 @@ export class TwoFactorYubiKeyComponent extends TwoFactorBaseComponent {
             this.formPromise = this.apiService.putTwoFactorYubiKey(request);
             const response = await this.formPromise;
             await this.processResponse(response);
-            this.toasterService.popAsync('success', null, this.i18nService.t('yubikeysUpdated'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('yubikeysUpdated'));
         });
     }
 
diff --git a/src/app/settings/update-key.component.ts b/src/app/settings/update-key.component.ts
index a2638c4c197..ed465e50f2a 100644
--- a/src/app/settings/update-key.component.ts
+++ b/src/app/settings/update-key.component.ts
@@ -1,10 +1,5 @@
 import { Component } from '@angular/core';
 
-import {
-    Toast,
-    ToasterService,
-} from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CipherService } from 'jslib-common/abstractions/cipher.service';
 import { CryptoService } from 'jslib-common/abstractions/crypto.service';
@@ -12,6 +7,7 @@ import { FolderService } from 'jslib-common/abstractions/folder.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
 import { MessagingService } from 'jslib-common/abstractions/messaging.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { SyncService } from 'jslib-common/abstractions/sync.service';
 
 import { EncString } from 'jslib-common/models/domain/encString';
@@ -29,7 +25,7 @@ export class UpdateKeyComponent {
     formPromise: Promise<any>;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private cryptoService: CryptoService,
+        private platformUtilsService: PlatformUtilsService, private cryptoService: CryptoService,
         private messagingService: MessagingService, private syncService: SyncService,
         private folderService: FolderService, private cipherService: CipherService,
         private logService: LogService) { }
@@ -41,7 +37,7 @@ export class UpdateKeyComponent {
         }
 
         if (this.masterPassword == null || this.masterPassword === '') {
-            this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
+            this.platformUtilsService.showToast('error', this.i18nService.t('errorOccurred'),
                 this.i18nService.t('masterPassRequired'));
             return;
         }
@@ -51,13 +47,8 @@ export class UpdateKeyComponent {
                 return this.apiService.postAccountKey(request);
             });
             await this.formPromise;
-            const toast: Toast = {
-                type: 'success',
-                title: this.i18nService.t('keyUpdated'),
-                body: this.i18nService.t('logBackInOthersToo'),
-                timeout: 15000,
-            };
-            this.toasterService.popAsync(toast);
+            this.platformUtilsService.showToast('success', this.i18nService.t('keyUpdated'),
+                this.i18nService.t('logBackInOthersToo'), { timeout: 15000 });
             this.messagingService.send('logout');
         } catch (e) {
             this.logService.error(e);
diff --git a/src/app/settings/update-license.component.ts b/src/app/settings/update-license.component.ts
index 89106965c52..f8ab1082a39 100644
--- a/src/app/settings/update-license.component.ts
+++ b/src/app/settings/update-license.component.ts
@@ -5,11 +5,10 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 
 @Component({
     selector: 'app-update-license',
@@ -23,13 +22,13 @@ export class UpdateLicenseComponent {
     formPromise: Promise<any>;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private logService: LogService) { }
+        private platformUtilsService: PlatformUtilsService, private logService: LogService) { }
 
     async submit() {
         const fileEl = document.getElementById('file') as HTMLInputElement;
         const files = fileEl.files;
         if (files == null || files.length === 0) {
-            this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
+            this.platformUtilsService.showToast('error', this.i18nService.t('errorOccurred'),
                 this.i18nService.t('selectFile'));
             return;
         }
@@ -50,7 +49,7 @@ export class UpdateLicenseComponent {
             });
 
             await this.formPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('updatedLicense'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('updatedLicense'));
             this.onUpdated.emit();
         } catch (e) {
             this.logService.error(e);
diff --git a/src/app/settings/user-billing.component.ts b/src/app/settings/user-billing.component.ts
index f242df0051e..1fc5a4daf15 100644
--- a/src/app/settings/user-billing.component.ts
+++ b/src/app/settings/user-billing.component.ts
@@ -3,8 +3,6 @@ import {
     OnInit,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { BillingResponse } from 'jslib-common/models/response/billingResponse';
 
 import { ApiService } from 'jslib-common/abstractions/api.service';
@@ -35,7 +33,7 @@ export class UserBillingComponent implements OnInit {
     verifyBankPromise: Promise<any>;
 
     constructor(protected apiService: ApiService, protected i18nService: I18nService,
-        protected toasterService: ToasterService, protected platformUtilsService: PlatformUtilsService,
+        protected platformUtilsService: PlatformUtilsService,
         private logService: LogService) { }
 
     async ngOnInit() {
@@ -67,7 +65,7 @@ export class UserBillingComponent implements OnInit {
             request.amount2 = this.verifyAmount2;
             this.verifyBankPromise = this.apiService.postOrganizationVerifyBank(this.organizationId, request);
             await this.verifyBankPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('verifiedBankAccount'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('verifiedBankAccount'));
             this.load();
         } catch (e) {
             this.logService.error(e);
diff --git a/src/app/settings/user-subscription.component.ts b/src/app/settings/user-subscription.component.ts
index 5ed63db5995..15e86c06cc9 100644
--- a/src/app/settings/user-subscription.component.ts
+++ b/src/app/settings/user-subscription.component.ts
@@ -4,8 +4,6 @@ import {
 } from '@angular/core';
 import { Router } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { SubscriptionResponse } from 'jslib-common/models/response/subscriptionResponse';
 
 import { ApiService } from 'jslib-common/abstractions/api.service';
@@ -32,7 +30,7 @@ export class UserSubscriptionComponent implements OnInit {
 
     constructor(private tokenService: TokenService, private apiService: ApiService,
         private platformUtilsService: PlatformUtilsService, private i18nService: I18nService,
-        private toasterService: ToasterService, private router: Router, private logService: LogService) {
+        private router: Router, private logService: LogService) {
         this.selfHosted = platformUtilsService.isSelfHost();
     }
 
@@ -77,7 +75,7 @@ export class UserSubscriptionComponent implements OnInit {
         try {
             this.reinstatePromise = this.apiService.postReinstatePremium();
             await this.reinstatePromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('reinstated'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('reinstated'));
             this.load();
         } catch (e) {
             this.logService.error(e);
@@ -104,7 +102,7 @@ export class UserSubscriptionComponent implements OnInit {
         try {
             this.cancelPromise = this.apiService.postCancelPremium();
             await this.cancelPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('canceledSubscription'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('canceledSubscription'));
             this.load();
         } catch (e) {
             this.logService.error(e);
diff --git a/src/app/settings/verify-email.component.ts b/src/app/settings/verify-email.component.ts
index 76d1167d8e5..f2b5e1539b6 100644
--- a/src/app/settings/verify-email.component.ts
+++ b/src/app/settings/verify-email.component.ts
@@ -1,10 +1,9 @@
 import { Component } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 
 @Component({
     selector: 'app-verify-email',
@@ -14,7 +13,7 @@ export class VerifyEmailComponent {
     actionPromise: Promise<any>;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private logService: LogService) { }
+        private platformUtilsService: PlatformUtilsService, private logService: LogService) { }
 
     async send() {
         if (this.actionPromise != null) {
@@ -23,7 +22,7 @@ export class VerifyEmailComponent {
         try {
             this.actionPromise = this.apiService.postAccountVerifyEmail();
             await this.actionPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('checkInboxForVerification'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('checkInboxForVerification'));
         } catch (e) {
             this.logService.error(e);
         }
diff --git a/src/app/tools/import.component.ts b/src/app/tools/import.component.ts
index 9126c368173..5b194871e97 100644
--- a/src/app/tools/import.component.ts
+++ b/src/app/tools/import.component.ts
@@ -4,8 +4,6 @@ import {
 } from '@angular/core';
 import { Router } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { ImportOption, ImportService } from 'jslib-common/abstractions/import.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
@@ -32,7 +30,7 @@ export class ImportComponent implements OnInit {
     protected organizationId: string = null;
     protected successNavigate: any[] = ['vault'];
 
-    constructor(protected i18nService: I18nService, protected toasterService: ToasterService,
+    constructor(protected i18nService: I18nService,
         protected importService: ImportService, protected router: Router,
         protected platformUtilsService: PlatformUtilsService, protected policyService: PolicyService,
         private logService: LogService) { }
@@ -68,7 +66,7 @@ export class ImportComponent implements OnInit {
 
         const importer = this.importService.getImporter(this.format, this.organizationId);
         if (importer === null) {
-            this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
+            this.platformUtilsService.showToast('error', this.i18nService.t('errorOccurred'),
                 this.i18nService.t('selectFormat'));
             this.loading = false;
             return;
@@ -77,7 +75,7 @@ export class ImportComponent implements OnInit {
         const fileEl = document.getElementById('file') as HTMLInputElement;
         const files = fileEl.files;
         if ((files == null || files.length === 0) && (this.fileContents == null || this.fileContents === '')) {
-            this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
+            this.platformUtilsService.showToast('error', this.i18nService.t('errorOccurred'),
                 this.i18nService.t('selectFile'));
             this.loading = false;
             return;
@@ -96,7 +94,7 @@ export class ImportComponent implements OnInit {
         }
 
         if (fileContents == null || fileContents === '') {
-            this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
+            this.platformUtilsService.showToast('error', this.i18nService.t('errorOccurred'),
                 this.i18nService.t('selectFile'));
             this.loading = false;
             return;
@@ -110,7 +108,7 @@ export class ImportComponent implements OnInit {
                 this.loading = false;
                 return;
             }
-            this.toasterService.popAsync('success', null, this.i18nService.t('importSuccess'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('importSuccess'));
             this.router.navigate(this.successNavigate);
         } catch (e) {
             this.logService.error(e);
diff --git a/src/app/vault/bulk-actions.component.ts b/src/app/vault/bulk-actions.component.ts
index 8f65bd6d431..45abaaeef0b 100644
--- a/src/app/vault/bulk-actions.component.ts
+++ b/src/app/vault/bulk-actions.component.ts
@@ -4,10 +4,10 @@ import {
     ViewChild,
     ViewContainerRef,
 } from '@angular/core';
-import { ToasterService } from 'angular2-toaster';
 
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { PasswordRepromptService } from 'jslib-common/abstractions/passwordReprompt.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { CipherRepromptType } from 'jslib-common/enums/cipherRepromptType';
 
 import { ModalService } from 'jslib-angular/services/modal.service';
@@ -34,7 +34,7 @@ export class BulkActionsComponent {
     @ViewChild('bulkMoveTemplate', { read: ViewContainerRef, static: true }) bulkMoveModalRef: ViewContainerRef;
     @ViewChild('bulkShareTemplate', { read: ViewContainerRef, static: true }) bulkShareModalRef: ViewContainerRef;
 
-    constructor(private toasterService: ToasterService, private i18nService: I18nService,
+    constructor(private platformUtilsService: PlatformUtilsService, private i18nService: I18nService,
         private modalService: ModalService, private passwordRepromptService: PasswordRepromptService) { }
 
     async bulkDelete() {
@@ -44,7 +44,7 @@ export class BulkActionsComponent {
 
         const selectedIds = this.ciphersComponent.getSelectedIds();
         if (selectedIds.length === 0) {
-            this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
+            this.platformUtilsService.showToast('error', this.i18nService.t('errorOccurred'),
                 this.i18nService.t('nothingSelected'));
             return;
         }
@@ -67,7 +67,7 @@ export class BulkActionsComponent {
 
         const selectedIds = this.ciphersComponent.getSelectedIds();
         if (selectedIds.length === 0) {
-            this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
+            this.platformUtilsService.showToast('error', this.i18nService.t('errorOccurred'),
                 this.i18nService.t('nothingSelected'));
             return;
         }
@@ -88,7 +88,7 @@ export class BulkActionsComponent {
 
         const selectedCiphers = this.ciphersComponent.getSelected();
         if (selectedCiphers.length === 0) {
-            this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
+            this.platformUtilsService.showToast('error', this.i18nService.t('errorOccurred'),
                 this.i18nService.t('nothingSelected'));
             return;
         }
@@ -109,7 +109,7 @@ export class BulkActionsComponent {
 
         const selectedIds = this.ciphersComponent.getSelectedIds();
         if (selectedIds.length === 0) {
-            this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
+            this.platformUtilsService.showToast('error', this.i18nService.t('errorOccurred'),
                 this.i18nService.t('nothingSelected'));
             return;
         }
diff --git a/src/app/vault/bulk-delete.component.ts b/src/app/vault/bulk-delete.component.ts
index 403e3144bf3..a5707ecb236 100644
--- a/src/app/vault/bulk-delete.component.ts
+++ b/src/app/vault/bulk-delete.component.ts
@@ -4,11 +4,11 @@ import {
     Input,
     Output,
 } from '@angular/core';
-import { ToasterService } from 'angular2-toaster';
 
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CipherService } from 'jslib-common/abstractions/cipher.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 
 import { Organization } from 'jslib-common/models/domain/organization';
 import { CipherBulkDeleteRequest } from 'jslib-common/models/request/cipherBulkDeleteRequest';
@@ -25,7 +25,7 @@ export class BulkDeleteComponent {
 
     formPromise: Promise<any>;
 
-    constructor(private cipherService: CipherService, private toasterService: ToasterService,
+    constructor(private cipherService: CipherService, private platformUtilsService: PlatformUtilsService,
         private i18nService: I18nService, private apiService: ApiService) { }
 
     async submit() {
@@ -38,7 +38,7 @@ export class BulkDeleteComponent {
         await this.formPromise;
 
         this.onDeleted.emit();
-        this.toasterService.popAsync('success', null, this.i18nService.t(this.permanent ? 'permanentlyDeletedItems'
+        this.platformUtilsService.showToast('success', null, this.i18nService.t(this.permanent ? 'permanentlyDeletedItems'
             : 'deletedItems'));
     }
 
diff --git a/src/app/vault/bulk-move.component.ts b/src/app/vault/bulk-move.component.ts
index bee6528e4e4..243742ed82c 100644
--- a/src/app/vault/bulk-move.component.ts
+++ b/src/app/vault/bulk-move.component.ts
@@ -6,11 +6,10 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { CipherService } from 'jslib-common/abstractions/cipher.service';
 import { FolderService } from 'jslib-common/abstractions/folder.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 
 import { FolderView } from 'jslib-common/models/view/folderView';
 
@@ -26,7 +25,7 @@ export class BulkMoveComponent implements OnInit {
     folders: FolderView[] = [];
     formPromise: Promise<any>;
 
-    constructor(private cipherService: CipherService, private toasterService: ToasterService,
+    constructor(private cipherService: CipherService, private platformUtilsService: PlatformUtilsService,
         private i18nService: I18nService, private folderService: FolderService) { }
 
     async ngOnInit() {
@@ -38,6 +37,6 @@ export class BulkMoveComponent implements OnInit {
         this.formPromise = this.cipherService.moveManyWithServer(this.cipherIds, this.folderId);
         await this.formPromise;
         this.onMoved.emit();
-        this.toasterService.popAsync('success', null, this.i18nService.t('movedItems'));
+        this.platformUtilsService.showToast('success', null, this.i18nService.t('movedItems'));
     }
 }
diff --git a/src/app/vault/bulk-restore.component.ts b/src/app/vault/bulk-restore.component.ts
index e18fdb7e374..8e6c6f3c0c0 100644
--- a/src/app/vault/bulk-restore.component.ts
+++ b/src/app/vault/bulk-restore.component.ts
@@ -5,10 +5,9 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { CipherService } from 'jslib-common/abstractions/cipher.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 
 @Component({
     selector: 'app-vault-bulk-restore',
@@ -20,13 +19,13 @@ export class BulkRestoreComponent {
 
     formPromise: Promise<any>;
 
-    constructor(private cipherService: CipherService, private toasterService: ToasterService,
+    constructor(private cipherService: CipherService, private platformUtilsService: PlatformUtilsService,
         private i18nService: I18nService) { }
 
     async submit() {
         this.formPromise = this.cipherService.restoreManyWithServer(this.cipherIds);
         await this.formPromise;
         this.onRestored.emit();
-        this.toasterService.popAsync('success', null, this.i18nService.t('restoredItems'));
+        this.platformUtilsService.showToast('success', null, this.i18nService.t('restoredItems'));
     }
 }
diff --git a/src/app/vault/bulk-share.component.ts b/src/app/vault/bulk-share.component.ts
index 21b244bf537..1944a7b9bf2 100644
--- a/src/app/vault/bulk-share.component.ts
+++ b/src/app/vault/bulk-share.component.ts
@@ -6,12 +6,11 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { CipherService } from 'jslib-common/abstractions/cipher.service';
 import { CollectionService } from 'jslib-common/abstractions/collection.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { UserService } from 'jslib-common/abstractions/user.service';
 
 import { CipherView } from 'jslib-common/models/view/cipherView';
@@ -36,7 +35,7 @@ export class BulkShareComponent implements OnInit {
 
     private writeableCollections: CollectionView[] = [];
 
-    constructor(private cipherService: CipherService, private toasterService: ToasterService,
+    constructor(private cipherService: CipherService, private platformUtilsService: PlatformUtilsService,
         private i18nService: I18nService, private collectionService: CollectionService,
         private userService: UserService, private logService: LogService) { }
 
@@ -73,7 +72,7 @@ export class BulkShareComponent implements OnInit {
             await this.formPromise;
             this.onShared.emit();
             const orgName = this.organizations.find(o => o.id === this.organizationId)?.name ?? this.i18nService.t('organization');
-            this.toasterService.popAsync('success', null, this.i18nService.t('movedItemsToOrg', orgName));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('movedItemsToOrg', orgName));
         } catch (e) {
             this.logService.error(e);
         }
diff --git a/src/app/vault/ciphers.component.ts b/src/app/vault/ciphers.component.ts
index a5cf1efffb0..82091be7b84 100644
--- a/src/app/vault/ciphers.component.ts
+++ b/src/app/vault/ciphers.component.ts
@@ -6,8 +6,6 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { CipherService } from 'jslib-common/abstractions/cipher.service';
 import { EventService } from 'jslib-common/abstractions/event.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
@@ -49,7 +47,7 @@ export class CiphersComponent extends BaseCiphersComponent implements OnDestroy
     private pagedCiphersCount = 0;
     private refreshing = false;
 
-    constructor(searchService: SearchService, protected toasterService: ToasterService,
+    constructor(searchService: SearchService,
         protected i18nService: I18nService, protected platformUtilsService: PlatformUtilsService,
         protected cipherService: CipherService, protected eventService: EventService,
         protected totpService: TotpService, protected userService: UserService,
@@ -156,7 +154,7 @@ export class CiphersComponent extends BaseCiphersComponent implements OnDestroy
         try {
             this.actionPromise = this.deleteCipher(c.id, permanent);
             await this.actionPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t(permanent ? 'permanentlyDeletedItem'
+            this.platformUtilsService.showToast('success', null, this.i18nService.t(permanent ? 'permanentlyDeletedItem'
                 : 'deletedItem'));
             this.refresh();
         } catch (e) {
@@ -180,7 +178,7 @@ export class CiphersComponent extends BaseCiphersComponent implements OnDestroy
         try {
             this.actionPromise = this.cipherService.restoreWithServer(c.id);
             await this.actionPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('restoredItem'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('restoredItem'));
             this.refresh();
         } catch (e) {
             this.logService.error(e);
@@ -204,7 +202,7 @@ export class CiphersComponent extends BaseCiphersComponent implements OnDestroy
         }
 
         this.platformUtilsService.copyToClipboard(value, { window: window });
-        this.toasterService.popAsync('info', null,
+        this.platformUtilsService.showToast('info', null,
             this.i18nService.t('valueCopied', this.i18nService.t(typeI18nKey)));
 
         if (typeI18nKey === 'password' || typeI18nKey === 'verificationCodeTotp') {
diff --git a/src/scss/styles.scss b/src/scss/styles.scss
index 45a91fe1844..481eb855a78 100644
--- a/src/scss/styles.scss
+++ b/src/scss/styles.scss
@@ -40,7 +40,7 @@
 @import "~bootstrap/scss/_utilities";
 @import "~bootstrap/scss/_print";
 
-@import "~angular2-toaster/toaster";
+@import '~ngx-toastr/toastr';
 @import "~font-awesome/scss/font-awesome.scss";
 @import "~sweetalert2/src/sweetalert2.scss";
 
diff --git a/src/scss/toasts.scss b/src/scss/toasts.scss
index 5d4c2034e33..64915ae77da 100644
--- a/src/scss/toasts.scss
+++ b/src/scss/toasts.scss
@@ -1,40 +1,34 @@
 .toast-container {
-    &.toast-top-right {
-        top: 76px;
-    }
-
     .toast-close-button {
         font-size: 18px;
         margin-right: 4px;
     }
 
-    .toast {
+    .ngx-toastr {
         align-items: center;
         background-image: none !important;
         border-radius: $border-radius;
         box-shadow: 0 0 8px rgba(0, 0, 0, 0.35);
         display: flex;
-        opacity: 1 !important;
+        padding: 15px;
+
+        .toast-close-button {
+            position: absolute;
+            right: 5px;
+            top: 0;
+        }
 
         &:hover {
             box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
         }
 
-        &:before {
-            color: #FFFFFF;
+        .icon i::before {
             float: left;
+            font-style: normal;
             font-family: FontAwesome;
             font-size: 25px;
             line-height: 20px;
-            margin: auto 0 auto 15px;
-        }
-
-        .toast-content {
-            padding: 15px;
-        }
-
-        .toaster-icon {
-            display: none;
+            padding-right: 15px;
         }
 
         .toast-message {
@@ -48,7 +42,6 @@
         }
 
         &.toast-danger, &.toast-error {
-            background-image: none !important;
             @include themify($themes) {
                 background-color: themed('danger');
             }
@@ -59,13 +52,12 @@
                 }
             }
 
-            &:before {
+            .icon i::before {
                 content: "\f0e7";
             }
         }
 
         &.toast-warning {
-            background-image: none !important;
             @include themify($themes) {
                 background-color: themed('warning');
             }
@@ -76,13 +68,12 @@
                 }
             }
 
-            &:before {
+            .icon i::before {
                 content: "\f071";
             }
         }
 
         &.toast-info {
-            background-image: none !important;
             @include themify($themes) {
                 background-color: themed('info');
             }
@@ -93,13 +84,12 @@
                 }
             }
 
-            &:before {
+            .icon i:before {
                 content: "\f05a";
             }
         }
 
         &.toast-success {
-            background-image: none !important;
             @include themify($themes) {
                 background-color: themed('success');
             }
@@ -110,16 +100,9 @@
                 }
             }
 
-            &:before {
+            .icon i:before {
                 content: "\f00C";
             }
         }
     }
-    .layout_frontend .toast-top-right {
-        top: 20px;
-    }
-}
-
-.layout_frontend .toast-top-right {
-    top: 20px;
 }
diff --git a/tsconfig.json b/tsconfig.json
index 16f8f67b454..bdf8c4f4ba1 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -5,7 +5,7 @@
     "emitDecoratorMetadata": true,
     "experimentalDecorators": true,
     "module": "commonjs",
-    "target": "es5",
+    "target": "es2015",
     "lib": [
       "es5",
       "es6",