.row{
display: grid;
grid-template-columns: repeat(12, 1fr);
gap: 10px;
}
$list: 1 2 3 4 5 6 7 8 9 10 11 12;
@each $v in $list{
.col-#{$v}{
grid-column: span #{$v};
}
}
<div class="row">
<div class="col-6"></div>
<div class="col-3"></div>
<div class="col-3"></div>
</div>