Using a "next generation mixin" to generate themes in sass

component.scss

// Passing arguments from a mixin to a content block
// Planned for Sass 4
// https://github.com/sass/sass/issues/871

// File: common.scss
$theme-colors: (
  pink: #FF69B4,
  orange: #FFA500,
);

@mixin theme() {
  @each $theme, $color in $theme-colors {
    .app--#{$theme} & {
      @content($color);
    }
  }
}

// File: component.scss
.component {
  @include theme() using($color) {
    color: $color;
  }
}

// This code should output
.app--pink .component {
  color: #FF69B4;
}

.app--orange .component {
  color: #FFA500;
}