diff --git a/dist/styles/range-slider.css b/dist/styles/range-slider.css
index 6f9a5bdf12600c27c6cd0a939a50765751fa1818..b08189237597c728bff9370757722911ff4a02d1 100644
--- a/dist/styles/range-slider.css
+++ b/dist/styles/range-slider.css
@@ -1,20 +1,27 @@
-.range-slider {
+.range {
+  width: 400px;
+}
+.range .range-slider {
   position: relative;
 }
-.range-slider .scale {
+.range .range-slider .scale {
   position: absolute;
   background-color: #555;
 }
-.range-slider .knob {
+.range .range-slider .knob {
   position: absolute;
   cursor: pointer;
+  -moz-user-select: none;
+  -webkit-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  -o-user-select: none;
 }
-.range-slider .knob .button {
+.range .range-slider .knob .button {
   margin-top: -3px;
-  background: #f00;
-  width: 10px;
-  height: 10px;
-  border-radius: 50%;
+  background: #eee;
+  width: 30px;
+  height: 20px;
 }
 
 /*# sourceMappingURL=range-slider.css.map */
diff --git a/dist/styles/range-slider.sass b/dist/styles/range-slider.sass
index abb26fd5049af584c3bec03c3681190536385317..fbba6879351f38237547264dc0d986302db9abc2 100644
--- a/dist/styles/range-slider.sass
+++ b/dist/styles/range-slider.sass
@@ -1,18 +1,27 @@
-.range-slider
-  position: relative
+.range
+  width: 400px
 
-  .scale
-    position: absolute
-    background-color: #555
+  .range-slider
+    position: relative
 
-  .knob
-    position: absolute
-    cursor: pointer
+    .scale
+      position: absolute
+      background-color: #555
 
-    .button
-      margin-top: -3px
+    .knob
+      position: absolute
+      cursor: pointer
+      -moz-user-select: none
+      -webkit-user-select: none
+      -ms-user-select: none
+      user-select: none
+      -o-user-select: none
 
-      background: #f00
-      width: 10px
-      height: 10px
-      border-radius: 50%
+      .button
+        margin-top: -3px
+
+        //background: #f00
+        background: #eee
+        width: 30px
+        height: 20px
+        //border-radius: 50%
diff --git a/src/Gargantext/Components/GraphExplorer/RangeControl.purs b/src/Gargantext/Components/GraphExplorer/RangeControl.purs
index a8fbce3cc23df6fda601a3261465f0a221ac04b0..31f5c10a6a6e89eace7ddb3acff04e30892a7725 100644
--- a/src/Gargantext/Components/GraphExplorer/RangeControl.purs
+++ b/src/Gargantext/Components/GraphExplorer/RangeControl.purs
@@ -29,7 +29,7 @@ rangeControlCpt = R.hooksComponent "RangeButton" cpt
   where
     cpt {caption, sliderProps} _ = do
       pure $
-        H.span {}
+        H.span {className: "range"}
           [ H.label {} [ H.text caption ]
           , RS.rangeSlider sliderProps
           ]
diff --git a/src/Gargantext/Components/RangeSlider.purs b/src/Gargantext/Components/RangeSlider.purs
index 1c54c73c7b946aeb76c0c1e89c30f1f8a641017c..424884fa62d14d1f87fd917fb2de728b38331440 100644
--- a/src/Gargantext/Components/RangeSlider.purs
+++ b/src/Gargantext/Components/RangeSlider.purs
@@ -154,8 +154,10 @@ renderScale ref {width,height} (Range.Closed {min, max}) =
 renderKnob :: Knob -> R.Ref (Nullable DOM.Element) -> Range.NumberRange -> Bounds -> R2.StateSetter (Maybe Knob) -> Int -> R.Element
 renderKnob knob ref (Range.Closed value) bounds set precision =
   H.div { ref, tabIndex, className, aria, onMouseDown, style } [
-      H.div { className: "button" } []
-    , H.text $ text $ toFixed precision val
+      H.div { className: "button" }
+        [
+          H.text $ text $ toFixed precision val
+        ]
   ]
   where
     text (Just num) = num