Generated by SassMeister.com. http://sassmeister.com/gist/dbec4d343ef03b95a61c

SassMeister-input-HTML.html

// 
// SCSS unit conversion
//

SassMeister-input.scss

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

//
// em + rem
// ... add multi values for em compounds
// Detect native conversion  0pt + 12px = 9pt
// to 


// Absolute lengths
@function str($val) { @return #{$val};  }
@function num($val) { @return convert(num, $val);  }

// Absolute lengths
@function px($val)  { @return convert(px, $val);   }
@function pt($val)  { @return convert(pt, $val);   }
@function pc($val)  { @return convert(pc, $val);   }
@function in($val)  { @return convert(in, $val);   }
@function mm($val)  { @return convert(mm, $val);   }
@function cm($val)  { @return convert(cm, $val);   }

// Angles
@function deg($val) { @return convert(deg, $val);  }
@function rad($val) { @return convert(rad, $val);  }
@function grad($val){ @return convert(grad,$val);  }
@function turn($val){ @return convert(turn,$val);  }

// Resolution
@function dpi($val) { @return convert(dpi,$val);  }
@function dpcm($val){ @return convert(dpcm,$val);  }
@function dppx($val){ @return convert(dppx,$val);  }

// Time
@function ms($val){ @return convert(ms,$val);  }
@function s($val){ @return convert(s,$val);  }

// Frequencies
@function Hz($val) { @return convert(Hz,$val);  }
@function kHz($val){ @return convert(kHz,$val);  }


@function pct($val,$base:1){ 
  @return percentage(num(px($val)) / num(px($base)) ); 
}

//
// Convert 
// 
@function convert($unit, $val){
  $val:if( type-of($val) == 'string', to-unit($val), $val);
  $unit: map-get((
    px: 0px, pt: 0pt, pc: 0pc, in: 0in, mm: 0mm, cm: 0cm,  // absolute length
    em: 0em, rem: 0rem, ch: 0ch, ex: 0ex,                  // relative length - font based
    vw: 0vw, vh: 0vh, vmin: 0vmin, vmax: 0vmax,            // relative length - viewport based
    deg: 0deg, turn: 0turn, grad: 0grad, rad: 0rad,        // angle
    s: 0s, ms: 0ms,                                        // time
    Hz: 0Hz, kHz: 0kHz,                                    // frequencie
    dpi: 0dpi, dpcm: 0dpcm, dppx: 0dppx,                   // resolution
    '%': 0%, '': 0                                   		   // percent or number
  ), $unit);
  @if not $unit {
    @warn 'Unknown unit: `#{$unit}`.'; 
    @return null;  
  }
  @return if(unit($unit)=='', $val/($val*0+1), $unit + $val );   
}

//
// Convert (string) to unit 
// 

@function to-unit($val){
  @if type-of($val) == 'number' { @return $val; }
  @if type-of($val) == 'string' {
    $str-numbers: '0' '1' '2' '3' '4' '5' '6' '7' '8' '9';
    $number : 0;       // return value
    $devider: 0;       // devider used to set decimals  
    $decimal: false;   // flag to mark decimal place  
    $unit   : '';      // unit
    @for $i from 1 through str-length($val) {
      $char   : str-slice($val, $i, $i);         // current charcater
      $index  : index($str-numbers, $char);      // is character a number
      $decimal: if($char=='.', true,  $decimal); // mark first decimal      
      // Add number part
      // Example - looping through 1973 
      // 0   * 10 + 1 = 1
      // 1   * 10 + 9 = 19
      // 19  * 10 + 7 = 197
      // 197 * 10 + 3 = 1973    
      @if $index {                                      // if character is a number  
        $devider: if($decimal, $devider + 1, $devider); // increment devider if we have a decimal flag
        $number:  $number * 10 + $index - 1;            // add number part ($index - 1 is the new part)
      }      
      // Add unit part 
      // To keep it simple we remove spaces and multiple dots and dashes 
      // '- 1 . 2 3 4 5 R.E.M -'  =>  -1.2345rem 
      // '+ p x 2 4 +'            =>  24px 
      @else if not index(' ' '-' '+' '.',$char) { // if character is not a number, ' ',-,+ or .
        $unit: $unit + $char;                     // add character to unit
      }        
    }
    $number: if(str-index($val, '-'), -$number, $number);  // negative value
    $number: $number / pow(10, $devider);                    // add decimals   
    // Return 
    @if($unit == ''){ @return $number; }                     // no unit return number          
    @return convert($unit, $number);
  }
  @warn 'Could not convert: `#{$val}` to unit.';
  @return null;
}



test { 
  //pct:pct(px(16), pt(12));
  //percentage: percentage(px(16) / 12pt);
  
  
  sec: s(100ms);
  /* */
  dpi: dpi(1dpi);
  dpi: dpi(1dppx);
  dpi: dpi(1dpcm);
  
  dppx: dppx(1dpi);
  dppx: dppx(1dppx);
  dppx: dppx(1dpcm);
  
  Hz:Hz(100);
  Hz:Hz(100kHz);
  }
.test {
  str-num-to-px : px('12'); 
  str-in-to-px : px('12in'); 
  pc-to-px : px(12pc); 
  in-to-px : px(12in); 
  mm-to-px : px(12mm); 
  cm-to-px : px(12cm);
  str-turn-to-deg : deg('1turn'); 
 }
  

SassMeister-output.css

test {
  sec: 0.1s;
  /* */
  dpi: 1dpi;
  dpi: 0.0104166667dpi;
  dpi: 0.3937007874dpi;
  dppx: 96dppx;
  dppx: 1dppx;
  dppx: 37.7952755906dppx;
  Hz: 100Hz;
  Hz: 100000Hz;
}

.test {
  str-num-to-px: 12px;
  str-in-to-px: 1152px;
  pc-to-px: 192px;
  in-to-px: 1152px;
  mm-to-px: 45.3543307087px;
  cm-to-px: 453.5433070866px;
  str-turn-to-deg: 360deg;
}

SassMeister-rendered.html

// 
// SCSS unit conversion
//