Generated by SassMeister.com.

SassMeister-input.scss

// ----
// libsass (v3.2.5)
// ----

@mixin type($color, $size, $weight) {
  font-family: 'Helvetica', sans-serif;
  color: $color;
  font-size: $size;
  font-weight: $weight;
}

%h1 {
  &--dark-ui {
    @include type(white, 2rem, bold);
  }
  
  &--light-ui {
    @include type(black, 2rem, bold);
  }
}

.bx--light {
  .h1--base {
    @extend %h1--dark-ui;
  }
}

.bx--dark {
  .h1--base {
    @extend %h1--light-ui
  }
}

SassMeister-output.css

.bx--light .h1--base {
  font-family: 'Helvetica', sans-serif;
  color: white;
  font-size: 2rem;
  font-weight: bold;
}

.bx--dark .h1--base {
  font-family: 'Helvetica', sans-serif;
  color: black;
  font-size: 2rem;
  font-weight: bold;
}