<===> input.scss
.container {
@for $i from 1 through 3 {
@at-root .box-#{$i} {
color: darken(red,($i * 5));
}
}
// Control
@at-root .outside-child {
background-color: blue;
}
}
<===> output.css
.box-1 {
color: #e60000;
}
.box-2 {
color: #cc0000;
}
.box-3 {
color: #b30000;
}
.outside-child {
background-color: blue;
}