How do I hide the select circle after toggling a switch?

Hey guys,

I have this problem for a long time but still cannot find a solution. Hopefully some of you can help me out!

This grey-ish circle stays visible until I press somewhere else and I’d like to remove it completely.

Bildschirmfoto 2020-04-06 um 03.56.14

By adding this:

switch-checked-color: “hsla(0, 0%, 0%, 0.0)”

to my theme, I was able to hide the “on-toggle”-circle, but the logical equivalent:

switch-unchecked-color: “hsla(0, 0%, 0%, 0.0)”

doesn’t change anything.

Thank you very much in advance!

I don’t know how to turn it off globally but this code allows me to get rid of the circle of an individual input_boolean

type: entities
title: Test
  - entity: input_boolean.test
            $: '.mdc-switch__thumb-underlay {--mdc-ripple-fg-size: 0px !important}'
1 Like

Thank you so much! Working like a charm :smiley:

1 Like

Hey man, here’s how to get rid of it globally. Put this in a theme:

mdc-ripple-color: "transparent"