SCSS: mixin rem.scss

// A function to strip unit type from numbers
@function strip-units($number) {
  @return $number / ($number * 0 + 1);
}

// A mixin to remify a property
@mixin rem($prop, $data) {
  $len: length($data);

  $px_list: null;
  // Make a list of px values
  @for $i from 1 through $len {
    $item: nth($data, $i);
    @if type-of($item) == number and unit($item) != "px" {
      $item: strip-units($item * 16) + px;
    }
    $px_list: append(#{$px_list}, $item);
  }

  $rem_list: null;
  // Make a list of rem values
  @for $i from 1 through $len {
    $item: nth($data, $i);
    // Go through each item in the list
    // to apply rem sizing, but only for numbers
    @if type-of($item) == number {
      $divisor: 1;
      @if unit($item) == "px" {
        $divisor: 16;
      }
      // Set item to rem
      $item: strip-units($item / $divisor) + rem;
    }
    $rem_list: append($rem_list, $item);
  }
  // Output the results
  #{$prop}: $px_list;
  #{$prop}: $rem_list;
}

// Shortcuts for various properties
@mixin font-size($size: 1) {
  @include rem(font-size, $size);
}
@mixin margin($list) {
  @include rem(margin, $list);
}