在Sass中创建动态变量

Question

我有一些有关颜色代码的变量。

$label-yellow: #fcd639;
$label-green: #3f9470;
$label-skyblue: #29b6f6;
$label-blue: #5c6bc0;
$label-purple: #ab47bc;
$label-orange: #ffa726;
$label-brown: #8d6e63;
$label-red: #c70039;
$label-black: #353839;
$label-gray: #7a8088;
$label-pink: #eb0b93;

$label-colors: (
  yellow: $label-yellow, 
  green: $label-green, 
  skyblue: $label-skyblue, 
  blue: $label-blue, 
  purple: $label-purple, 
  orange: $label-orange, 
  brown: $label-brown, 
  red: $label-red,
  black: $label-black,
  gray: $label-gray,
  pink: $label-pink,
);

我正在尝试在这些变量之上创建新变量。

我期望的结果

  $label-yellow-1: rgba($label-yellow, 0.5);
  $label-yellow-2: rgba($label-yellow, 0.6);
  ...

  $label-pink-1: rgba($label-pink, 0.5);
  $label-pink-2: rgba($label-pink, 0.6);

我尝试过的事情

@each $name, $color in $label-colors {
  @for $i from 1 to 5 {
    $name-#{$color}-#{$i}: rgba($color, 0.5 + ($i*0.1))
  }
}