diff --git a/scss/_functions.scss b/scss/_functions.scss
new file mode 100644
index 000000000000..5aa9f6620933
--- /dev/null
+++ b/scss/_functions.scss
@@ -0,0 +1,49 @@
+// Bootstrap functions
+//
+// Utility mixins and functions for evalutating source code across our variables, maps, and mixins.
+
+// Ascending
+// Used to evaluate Sass maps like our grid breakpoints.
+@mixin _assert-ascending($map, $map-name) {
+  $prev-key: null;
+  $prev-num: null;
+  @each $key, $num in $map {
+    @if $prev-num == null {
+      // Do nothing
+    } @else if not comparable($prev-num, $num) {
+      @warn "Potentially invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} whose unit makes it incomparable to #{$prev-num}, the value of the previous key '#{$prev-key}' !";
+    } @else if $prev-num >= $num {
+      @warn "Invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} which isn't greater than #{$prev-num}, the value of the previous key '#{$prev-key}' !";
+    }
+    $prev-key: $key;
+    $prev-num: $num;
+  }
+}
+
+// Starts at zero
+// Another grid mixin that ensures the min-width of the lowest breakpoint starts at 0.
+@mixin _assert-starts-at-zero($map) {
+  $values: map-values($map);
+  $first-value: nth($values, 1);
+  @if $first-value != 0 {
+    @warn "First breakpoint in `$grid-breakpoints` must start at 0, but starts at #{$first-value}.";
+  }
+}
+
+// Replace `$search` with `$replace` in `$string`
+// Used on our SVG icon backgrounds for custom forms.
+//
+// @author Hugo Giraudel
+// @param {String} $string - Initial string
+// @param {String} $search - Substring to replace
+// @param {String} $replace ('') - New value
+// @return {String} - Updated string
+@function str-replace($string, $search, $replace: "") {
+  $index: str-index($string, $search);
+
+  @if $index {
+    @return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);
+  }
+
+  @return $string;
+}
diff --git a/scss/_variables.scss b/scss/_variables.scss
index 5bd938c6b023..92d5e11e0a2c 100644
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -6,7 +6,6 @@
 // Variables should follow the `$component-state-property-size` formula for
 // consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs.
 
-
 // Table of Contents
 //
 // Colors
@@ -44,51 +43,6 @@
 // Close
 // Code
 
-@mixin _assert-ascending($map, $map-name) {
-  $prev-key: null;
-  $prev-num: null;
-  @each $key, $num in $map {
-    @if $prev-num == null {
-      // Do nothing
-    } @else if not comparable($prev-num, $num) {
-      @warn "Potentially invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} whose unit makes it incomparable to #{$prev-num}, the value of the previous key '#{$prev-key}' !";
-    } @else if $prev-num >= $num {
-      @warn "Invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} which isn't greater than #{$prev-num}, the value of the previous key '#{$prev-key}' !";
-    }
-    $prev-key: $key;
-    $prev-num: $num;
-  }
-}
-
-// Replace `$search` with `$replace` in `$string`
-// @author Hugo Giraudel
-// @param {String} $string - Initial string
-// @param {String} $search - Substring to replace
-// @param {String} $replace ('') - New value
-// @return {String} - Updated string
-@function str-replace($string, $search, $replace: "") {
-  $index: str-index($string, $search);
-
-  @if $index {
-    @return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);
-  }
-
-  @return $string;
-}
-
-@mixin _assert-starts-at-zero($map) {
-  $values: map-values($map);
-  $first-value: nth($values, 1);
-  @if $first-value != 0 {
-    @warn "First breakpoint in `$grid-breakpoints` must start at 0, but starts at #{$first-value}.";
-  }
-}
-
-
-// General variable structure
-//
-// Variable format should follow the `$component-modifier-state-property` order.
-
 
 // Colors
 //
diff --git a/scss/bootstrap-grid.scss b/scss/bootstrap-grid.scss
index f3699bc15de9..4b2bddd5d3d7 100644
--- a/scss/bootstrap-grid.scss
+++ b/scss/bootstrap-grid.scss
@@ -22,6 +22,7 @@ html {
   box-sizing: inherit;
 }
 
+@import "functions";
 @import "variables";
 
 //
diff --git a/scss/bootstrap-reboot.scss b/scss/bootstrap-reboot.scss
index cdf59ab685bf..2700a5705604 100644
--- a/scss/bootstrap-reboot.scss
+++ b/scss/bootstrap-reboot.scss
@@ -2,6 +2,7 @@
 //
 // Includes only Normalize and our custom Reboot reset.
 
+@import "functions";
 @import "variables";
 @import "mixins";
 
diff --git a/scss/bootstrap.scss b/scss/bootstrap.scss
index 9ab2210b3195..131d9b63df65 100644
--- a/scss/bootstrap.scss
+++ b/scss/bootstrap.scss
@@ -5,13 +5,10 @@
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
  */
 
-// Core variables and mixins
+@import "functions";
 @import "variables";
 @import "mixins";
-
 @import "print";
-
-// Core CSS
 @import "reboot";
 @import "type";
 @import "images";
@@ -20,8 +17,6 @@
 @import "tables";
 @import "forms";
 @import "buttons";
-
-// Components
 @import "transitions";
 @import "dropdown";
 @import "button-group";
@@ -40,12 +35,8 @@
 @import "list-group";
 @import "responsive-embed";
 @import "close";
-
-// Components w/ JavaScript
 @import "modal";
 @import "tooltip";
 @import "popover";
 @import "carousel";
-
-// Utility classes
 @import "utilities";