$tile: 200px; .tile { width: $tile; height: $tile; } .container { -webkit-display: flex; display: flex; -webkit-flex-direction: row; flex-direction: row; } $team-colors:( Australia: #1e90ff, England: #ff3333, NewZealand: #181818, Brazil: #32cd32, ); @each $team, $color in $team-colors { .#{$team} { @extend .tile; background-color: $color; } } @debug Australian Color map-has-key($team-colors, Australia); @debug Colors map-values($team-colors); @debug All Countries map-keys($team-colors);
<div class="container"> <div class="Australia"></div> <div class="England"></div> <div class="NewZealand"></div> <div class="Brazil"></div> </div>