Проблема с переходом фильтров (CSS) ⇐ CSS

[Anonymous]

Переход и фильтр работает нормально (начальный цвет белый, а финальный цвет - голубовато -фиолетовый), однако переход фильтра делает так, чтобы он проходил нежелательные цвета, такие как розовый.

Код: Выделить всё

#discord-logo {
filter: brightness(0) saturate(100%) invert(100%) sepia(1%) saturate(2%) hue-rotate(324deg) brightness(106%) contrast(101%);
width: 40px;
height: 100%;
display: flex;
align-items: center;
transition: filter 0.2s linear;
}

#discord-logo:hover {
filter: brightness(0) saturate(100%) invert(35%) sepia(88%) saturate(2498%) hue-rotate(224deg) brightness(96%) contrast(90%);
}

my html -код

Код: Выделить всё

Discord Logo

Я думал, что, может быть, переход непрозрачности, где фиолетовый цвет svg находится под белым, таким образом, когда я переходит непрозрачность на верху>

Подробнее здесь: https://stackoverflow.com/questions/794 ... ilters-css