Как увеличить сочность цвета (scss)?

Question

[Михаил Р.]

Привет!

Допустим имеется цвет #ff7fa1, как средствами scss:
1. Увеличить его сочность до максимального уровня #ff0044?
2. Уменьшить его сочность до минимального уровня #ffffff?

Спасибо!

Comments

[iBird Rose]

переводи rgba и оперируй цифрами

Answer 1

[Михаил Р.]

Решение 1:

.element
{
color: hsla(hue($color), 10%, 10%, 1.0);
}

Решение 2:

.c1
{
  $l : lightness($color);
  color: if($l > 50, darken($color, ($l)-50), lighten($color, 50-($l)));
}

.c2
{
  color: lighten($color, 100-(lightness($color)));
}

Answer 2

[Alexander Pushkarev]

Осветление/затемнение
lighten(#ff7fa1, 20%)
darken(#ff7fa1, 20%)

Насыщенность
saturate(#ff7fa1, 20%)
desaturate(#ff7fa1, 20%)

Вставить цвет и посмотреть онлайн - scg.ar-ch.org

Comments

[Михаил Р.]

Попробуйте увеличить насыщенность моего цвета предложенным Вами методом saturate(#ff0044).

[Alexander Pushkarev]

Mike Ro, обновил, вторым параметром надо передавать % на сколько нужно изменить

[Михаил Р.]

Alexander Pushkarev, проблема не в процентах, попробуйте увеличить насыщенность именно моего цвета...

[Alexander Pushkarev]

Mike Ro, я там сайт вставил. В него цвет подставьте и посмотрите, пример - prntscr.com/jgxzwx

[Михаил Р.]

Alexander Pushkarev, что и следовало доказать, saturate #ff7fa1 не изменяет цвет.