diff --git a/src/function.scss b/src/function.scss
new file mode 100644
index 000000000..818b0bb66
--- /dev/null
+++ b/src/function.scss
@@ -0,0 +1,60 @@
+
+// =============== Custom function ==============================
+
+// convert string number to int or double
+@function to-number($value) {
+    @if type-of($value) == 'number' {
+      @return $value;
+    } @else if type-of($value) != 'string' {
+      @error 'Value for `to-number` should be a number or a string.';
+    }
+  
+    $result: 0;
+    $digits: 0;
+    $minus: str-slice($value, 1, 1) == '-';
+    $numbers: ('0': 0, '1': 1, '2': 2, '3': 3, '4': 4, '5': 5, '6': 6, '7': 7, '8': 8, '9': 9);
+  
+    @for $i from if($minus, 2, 1) through str-length($value) {
+      $character: str-slice($value, $i, $i);
+  
+      @if (index(map-keys($numbers), $character) or $character == '.') {
+        @if $character == '.' {
+          $digits: 1; 
+        } @else if $digits == 0 {
+          $result: $result * 10 + map-get($numbers, $character);  
+        } @else {
+          $digits: $digits * 10;
+          $result: $result + map-get($numbers, $character) / $digits;
+        }
+      }
+    }
+  
+    @return if($minus, -$result, $result);;
+  }
+  
+  // convert px to rem
+  @function rem($size) {
+    $remSize: to-number($size) / 16;
+    //Default font size on html is 16px;
+    @return #{$remSize}rem;
+  }
+  
+  // convert px to em
+  @function em($size) {
+    $remSize: to-number($size) / 16px;
+    @return #{$remSize}em;
+  }
+  
+  // convert pt to rem
+  @function pt-rem($size) {
+    $pxSize:  to-number($size) * 1.328147;
+    $remSize: $pxSize / 16;
+    @return #{$remSize}rem;
+  }
+  
+  // convert pt to em
+  @function pt-em($size) {
+    $pxSize:  to-number($size) * 1.328147;
+    $remSize: $pxSize / 16;
+    @return #{$remSize}em;
+  }
\ No newline at end of file