使用零件和变量构建颜色库

问：

_lists.scss 这是颜色列表文件

$text-color_white: #fff;
$text-color_black: #000;

_typo.scss 这是样式文件

@mixin textsize($selectors...) {
  @for $i from 0 to length($selectors) {
    .title-#{nth($selectors, $i + 1)} {
      font-size: #{nth($selectors, $i + 1)} + px;
    }
  }
}
@include textsize("16");

我想将颜色映射到 typo.scss，我想要这样的输出

.title-16 {
  font-size: 16px;
}

.title-16-text-color_white {
  font-size: 16px;
  color :#fff;
}

.title-16-$text-color_black{
  font-size: 16px;
  color :#000;
}

任何人都可以帮助我如何映射另一个部分的颜色并将其注入 typo.scss 以生成最终输出，就像我上面提供的一样。