-
Did you know that SassCSS modules provide a map of all the public variables? You can define eg: $primary: deeppink; $secondary: steelblue; etc... Then in another module: @use 'my/colors'; @use 'sass:meta'; $colors: meta.module-variables('colors');
-
Now you can still call your variables directly without fancy map-functions, but you can also loop over them! @each $name, $value in $colors { --#{$name}: #{$value}; } Now we have custom props auto-updated from Sass variables, even if we add/remove some in the source file!
-
yes: deeppink and steelblue are your new brand colors. I don't make the rules.