Generated by SassMeister.com.

SassMeister-input.scss

// ----
// Sass (v3.3.14)
// Compass (v1.0.1)
// ----

$logo-colors: (
  red: #f00,
  green: #0f0,
  blue: #00f
);




// logo.scss

@mixin logo($color: red) {
  background: $color;
}

@each $logo-color, $list in $logo-colors {
  %logo--#{$logo-color} {
    @include logo(#{$logo-color});
  }
}




// branding.scss

@mixin branding__logo($color: red, $margin: 10px) {
  @extend %logo--#{$color};
  margin: $margin;
}

@each $logo-color, $list in $logo-colors {
  %branding__logo--#{$logo-color} {
    @include branding__logo($logo-color);
  }
}




// style.scss

@each $logo-color, $list in $logo-colors {
  .branding__logo--#{$logo-color} {
    @extend %branding__logo--#{$logo-color};
  }
}

SassMeister-output.css

.branding__logo--red {
  background: red;
}

.branding__logo--green {
  background: green;
}

.branding__logo--blue {
  background: blue;
}

.branding__logo--red {
  margin: 10px;
}

.branding__logo--green {
  margin: 10px;
}

.branding__logo--blue {
  margin: 10px;
}