px to rem converting

input.scss

// ----
// Sass (v3.4.25)
// Compass (v1.0.3)
// ----

/**
 * Convert font-size from px to rem with px fallback
 *
 * @param $size - the value in pixel you want to convert
 *
 * e.g. p {@include fontSize(12px);}
 * 
 */

$basefontsize: 18px;

// Function for converting a px based font-size to rem.
@function calculateRem($size) {
  $remSize: $size / $basefontsize;
//Default font size on html element is 100%, equivalent to 16px;
  @return #{$remSize}rem;
}

// Mixin that will include the fall back px declaration as well as the calculated rem value.
@mixin fontSize($size) {
  font-size: $size;
  font-size: calculateRem($size);
}


h1 {
  @include fontSize(50px);
}

output.css

/**
 * Convert font-size from px to rem with px fallback
 *
 * @param $size - the value in pixel you want to convert
 *
 * e.g. p {@include fontSize(12px);}
 * 
 */
h1 {
  font-size: 50px;
  font-size: 2.77778rem;
}