Schwarz-Weiß-Opazitätsfunktionen

Es ist ziemlich üblich, ein wenig transparentes Schwarz oder Weiß zu benötigen. In CSS können Sie Folgendes tun:

.half-black {
  background: rgba(0, 0, 0, 0.5);
}

Es wird in Sass einfacher, wo Sie einen Farbnamen ersetzen können

.half-black {
  background: rgba(black, 0.5);
}

Oder es noch einfacher machen, indem Sie benutzerdefinierte Funktionen erstellen

@function black($opacity) {
  @return rgba(black, $opacity)
}
@function white($opacity) {
  @return rgba(white, $opacity)
}

.half-black {
  background: black(0.5);
}