diff --git a/package.json b/package.json
index fd0473f0..2abe5155 100644
--- a/package.json
+++ b/package.json
@@ -60,7 +60,7 @@
     "ionicons": "^6.0.3",
     "mixpanel-browser": "^2.45.0",
     "moment": "^2.30.1",
-    "ng5-slider": "^1.2.6",
+    "@angular-slider/ngx-slider": "^17.0.0",
     "rxjs": "~7.5.0",
     "tslib": "^2.3.0",
     "zone.js": "~0.11.4"
diff --git a/src/app/components/age-refinement-list/age-refinement-list.component.html b/src/app/components/age-refinement-list/age-refinement-list.component.html
index 0f03beb3..57e59c5d 100644
--- a/src/app/components/age-refinement-list/age-refinement-list.component.html
+++ b/src/app/components/age-refinement-list/age-refinement-list.component.html
@@ -43,9 +43,9 @@
                     {{ value.upper | age }}
                 </ion-label>
 
-                <ng5-slider [(value)]="value.lower" [(highValue)]="value.upper"
+                <ngx-slider [(value)]="value.lower" [(highValue)]="value.upper"
                     (userChangeEnd)="handleChange()"
-                    (userChange)="setLabel()" [options]="options"></ng5-slider>
+                    (userChange)="setLabel()" [options]="options"></ngx-slider>
                 <!--
                 <ion-range debounce="500" dualKnobs="true" (ionChange)="handleChange($event)"
                     [value]="value"
diff --git a/src/app/components/age-refinement-list/age-refinement-list.component.ts b/src/app/components/age-refinement-list/age-refinement-list.component.ts
index f40cc81a..835d623d 100644
--- a/src/app/components/age-refinement-list/age-refinement-list.component.ts
+++ b/src/app/components/age-refinement-list/age-refinement-list.component.ts
@@ -3,7 +3,7 @@ import { connectRange } from 'instantsearch.js/es/connectors';
 import { RangeRenderState } from 'instantsearch.js/es/connectors/range/connectRange';
 import { BaseWidget, NgAisIndex, NgAisInstantSearch } from 'angular-instantsearch';
 import { parseNumberInput, noop } from 'angular-instantsearch/esm2015/utils';
-import { Options } from 'ng5-slider';
+import { Options } from '@angular-slider/ngx-slider';
 
 
 @Component({
diff --git a/src/app/components/age-refinement-list/age-refinement-list.module.ts b/src/app/components/age-refinement-list/age-refinement-list.module.ts
index 11f80689..7c202eff 100644
--- a/src/app/components/age-refinement-list/age-refinement-list.module.ts
+++ b/src/app/components/age-refinement-list/age-refinement-list.module.ts
@@ -1,6 +1,6 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
-import { Ng5SliderModule } from 'ng5-slider';
+import { NgxSliderModule } from '@angular-slider/ngx-slider';
 import { FormsModule } from '@angular/forms';
 import { NgAisModule } from 'angular-instantsearch';
 import { IonicModule } from '@ionic/angular';
@@ -18,7 +18,7 @@ import { AgeRefinementListComponent } from './age-refinement-list.component';
       CommonModule,
       FormsModule,
       PipesModule,
-      Ng5SliderModule,
+      NgxSliderModule,
   ],
   exports: [
       AgeRefinementListComponent
diff --git a/src/app/components/date-range-refinement-list/date-range-refinement-list.component.ts b/src/app/components/date-range-refinement-list/date-range-refinement-list.component.ts
index a88fe9b1..0df45258 100644
--- a/src/app/components/date-range-refinement-list/date-range-refinement-list.component.ts
+++ b/src/app/components/date-range-refinement-list/date-range-refinement-list.component.ts
@@ -4,7 +4,7 @@ import { BaseWidget, NgAisIndex, NgAisInstantSearch } from 'angular-instantsearc
 import { parseNumberInput, noop } from 'angular-instantsearch/esm2015/utils';
 import {CalendarModal, CalendarModalOptions, CalendarResult} from 'ion2-calendar';
 import { ModalController } from '@ionic/angular';
-import {Options} from "ng5-slider";
+import {Options} from "@angular-slider/ngx-slider";
 
 @Component({
   selector: 'date-range-refinement-list',
diff --git a/src/app/components/range-refinement-list/range-refinement-list.html b/src/app/components/range-refinement-list/range-refinement-list.html
index f059c07d..d8f1d903 100644
--- a/src/app/components/range-refinement-list/range-refinement-list.html
+++ b/src/app/components/range-refinement-list/range-refinement-list.html
@@ -43,9 +43,9 @@
                     {{ value.upper | age }}
                 </ion-label>
 
-                <ng5-slider [(value)]="value.lower" [(highValue)]="value.upper"
+                <ngx-slider [(value)]="value.lower" [(highValue)]="value.upper"
                     (userChangeEnd)="handleChange()"
-                    (userChange)="setLabel()" [options]="options"></ng5-slider>
+                    (userChange)="setLabel()" [options]="options"></ngx-slider>
                 <!--
                 <ion-range debounce="500" dualKnobs="true" (ionChange)="handleChange($event)"
                     [value]="value"
diff --git a/src/app/components/range-refinement-list/range-refinement-list.module.ts b/src/app/components/range-refinement-list/range-refinement-list.module.ts
index 0a61b2d7..886985ba 100644
--- a/src/app/components/range-refinement-list/range-refinement-list.module.ts
+++ b/src/app/components/range-refinement-list/range-refinement-list.module.ts
@@ -6,7 +6,7 @@ import { FormsModule } from "@angular/forms";
 import { RangeRefinementComponent } from './range-refinement-list';
 
 import { NgAisModule } from 'angular-instantsearch';
-import { Ng5SliderModule } from 'ng5-slider'; 
+import { NgxSliderModule } from '@angular-slider/ngx-slider'; 
 
 import { PipesModule } from '../../pipes/pipes.module';
 
@@ -21,7 +21,7 @@ import { PipesModule } from '../../pipes/pipes.module';
         CommonModule,
         FormsModule,
         PipesModule,
-        Ng5SliderModule,
+        NgxSliderModule,
     ],
     exports: [
         RangeRefinementComponent
diff --git a/src/app/components/range-refinement-list/range-refinement-list.ts b/src/app/components/range-refinement-list/range-refinement-list.ts
index a95a4f6c..bf00254d 100644
--- a/src/app/components/range-refinement-list/range-refinement-list.ts
+++ b/src/app/components/range-refinement-list/range-refinement-list.ts
@@ -3,7 +3,7 @@ import { connectRange } from 'instantsearch.js/es/connectors';
 import { RangeRenderState } from 'instantsearch.js/es/connectors/range/connectRange';
 import { BaseWidget, NgAisIndex, NgAisInstantSearch } from 'angular-instantsearch';
 import { parseNumberInput, noop } from 'angular-instantsearch/esm2015/utils';
-import { Options } from 'ng5-slider';
+import { Options } from '@angular-slider/ngx-slider';
 
 
 @Component({
diff --git a/src/global.scss b/src/global.scss
index 4de486e9..e8f26878 100644
--- a/src/global.scss
+++ b/src/global.scss
@@ -432,13 +432,13 @@ ion-calendar-modal {
   margin: 0 auto !important;
 }
 
-ng5-slider {
+ngx-slider {
   $handleSize: 12px;
 
   background: var(--ion-color-custom-2) !important;
   margin: 10px 0 15px !important;
 
-  .ng5-slider-pointer {
+  .ngx-slider-pointer {
       width: 12px !important;
       height: 12px !important;
       top: -4px !important;
@@ -451,11 +451,11 @@ ng5-slider {
       }
   }
 
-  .ng5-slider-selection {
+  .ngx-slider-selection {
       background: var(--ion-color-custom-3) !important;
   }
 
-  .ng5-slider-bubble {
+  .ngx-slider-bubble {
       display: none !important;
   }
 }