# Md-slider .md-thumb shape

**URL:** <https://discourse.nodered.org/t/md-slider-md-thumb-shape/73824>\
**Category:** Dashboard\
**Created:** [17 January 2023 18:13 UTC](https://discourse.nodered.org/t/md-slider-md-thumb-shape/73824 "2023-01-17T18:13:28Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![dudest](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dudest/32/72328_2.png) [@dudest](https://discourse.nodered.org/u/dudest)\
**Post date:** [17 January 2023 18:13 UTC](https://discourse.nodered.org/t/md-slider-md-thumb-shape/73824/1 "2023-01-17T18:13:28Z")

</div>

Hello, I'm trying to change the shape of .md-thumb but I always seem to have a circle superimposed on top.

![Screenshot 2023-01-17 131425](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/1/9/19640345d1ebdc656beacc1d97c6c23a753e47c2.png)

```auto
md-slider .md-thumb {
    z-index: 10;
    position: absolute;
    left: -25px;
    top: 14px;
    width: 50px;
    height: 20px;
    border-radius: 5px;
    transform: scale(.9);
    transform: scale(.9);
    transition: all .4s cubic-bezier(.25,.8,.25,1);
    box-shadow: 0 0 6px #00000070;
    background-color: var(--color-text-primary);
}

```

Any Ideas on how to fix this?

---

<div class="post-metadata">

**Author:** ![dudest](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dudest/32/72328_2.png) [@dudest](https://discourse.nodered.org/u/dudest)\
**Post date:** [17 January 2023 23:45 UTC](https://discourse.nodered.org/t/md-slider-md-thumb-shape/73824/2 "2023-01-17T23:45:01Z")

</div>

I found a workaround by setting background colour to `--nr-dashboard-pageTitlebarBackgroundColor`.

```auto
md-slider .md-thumb {
    z-index: 10;
    position: absolute;
    left: -25px;
    top: 14px;
    width: 50px;
    height: 20px;
    border-radius: 5px;
    transform: scale(.9);
    transform: scale(.9);
    transition: all .4s cubic-bezier(.25,.8,.25,1);
    box-shadow: 0 0 6px #00000070;
    background-color: var(--nr-dashboard-pageTitlebarBackgroundColor);
}

```

😀

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [31 January 2023 23:45 UTC](https://discourse.nodered.org/t/md-slider-md-thumb-shape/73824/3 "2023-01-31T23:45:02Z")

</div>

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.