diff --git a/src/utilities.less b/src/utilities.less
index db4374e66..f5cc00e54 100644
--- a/src/utilities.less
+++ b/src/utilities.less
@@ -2,11 +2,11 @@
 
 @import "utilities/backgrounds";
 @import "utilities/borders";
+@import "utilities/constrain";
 @import "utilities/display";
 @import "utilities/flex";
 @import "utilities/grid";
 @import "utilities/images";
-@import "utilities/layout";
 @import "utilities/misc";
 @import "utilities/position";
 @import "utilities/spacing";
diff --git a/src/utilities/constrain.less b/src/utilities/constrain.less
new file mode 100644
index 000000000..b6874ceba
--- /dev/null
+++ b/src/utilities/constrain.less
@@ -0,0 +1,31 @@
+@constrain-xs: 20rem;
+@constrain-sm: 30rem;
+@constrain-md: 40rem;
+@constrain-lg: 50rem;
+@constrain-xl: 60rem;
+@constrain-2xl: 70rem;
+@constrain-3xl: 80rem;
+@constrain-4xl: 90rem;
+@constrain-5xl: 100rem;
+
+.constrain-xs { max-width: @constrain-xs; flex-basis: @constrain-xs; }
+.constrain-sm { max-width: @constrain-sm; flex-basis: @constrain-sm; }
+.constrain-md { max-width: @constrain-md; flex-basis: @constrain-md; }
+.constrain-lg { max-width: @constrain-lg; flex-basis: @constrain-lg; }
+.constrain-xl { max-width: @constrain-xl; flex-basis: @constrain-xl; }
+.constrain-2xl { max-width: @constrain-2xl; flex-basis: @constrain-2xl; }
+.constrain-3xl { max-width: @constrain-3xl; flex-basis: @constrain-3xl; }
+.constrain-4xl { max-width: @constrain-4xl; flex-basis: @constrain-4xl; }
+.constrain-5xl { max-width: @constrain-5xl; flex-basis: @constrain-5xl; }
+
+.responsive({
+  &constrain-xs { .constrain-xs; }
+  &constrain-sm { .constrain-sm; }
+  &constrain-md { .constrain-md; }
+  &constrain-lg { .constrain-lg; }
+  &constrain-xl { .constrain-xl; }
+  &constrain-2xl { .constrain-2xl; }
+  &constrain-3xl { .constrain-3xl; }
+  &constrain-4xl { .constrain-4xl; }
+  &constrain-5xl { .constrain-5xl; }
+});
diff --git a/src/utilities/layout.less b/src/utilities/layout.less
deleted file mode 100644
index 30b564d8c..000000000
--- a/src/utilities/layout.less
+++ /dev/null
@@ -1,15 +0,0 @@
-.constrain-xs { max-width: 22rem; flex-basis: 22rem; }
-.constrain-sm { max-width: 26rem; flex-basis: 26rem; }
-.constrain-md { max-width: 32rem; flex-basis: 32rem; }
-.constrain-lg { max-width: 40rem; flex-basis: 40rem; }
-.constrain-xl { max-width: 48rem; flex-basis: 48rem; }
-.constrain-xxl { max-width: 52rem; flex-basis: 52rem; }
-
-.responsive({
-  &constrain-xs { .constrain-xs; }
-  &constrain-sm { .constrain-sm; }
-  &constrain-md { .constrain-md; }
-  &constrain-lg { .constrain-lg; }
-  &constrain-xl { .constrain-xl; }
-  &constrain-xxl { .constrain-xxl; }
-});