diff --git a/ui/src/shared/constants/baseunits.js b/ui/src/shared/constants/baseunits.js
new file mode 100644
index 00000000..294e465b
--- /dev/null
+++ b/ui/src/shared/constants/baseunits.js
@@ -0,0 +1,9 @@
+const baseunit = {
+  xs: 3,
+  s: 6,
+  m: 12,
+  l: 18,
+  xl: 24
+};
+
+module.exports = baseunit;
diff --git a/ui/src/shared/constants/index.js b/ui/src/shared/constants/index.js
index 2368e31d..d43f03bd 100644
--- a/ui/src/shared/constants/index.js
+++ b/ui/src/shared/constants/index.js
@@ -6,6 +6,7 @@ const boxes = require('./boxes');
 const typography = require('./typography');
 const sizes = require('./sizes');
 const breakpoints = require('./breakpoints');
+const baseunit = require('./baseunits');
 
 const tables = {
   bg: 'transparent',
@@ -22,7 +23,8 @@ const constants = traverse({
   forms,
   sizes,
   tables,
-  typography
+  typography,
+  baseunit
 }).map(function(x) {
   return isFunction(x) ? x(this.parent.node) : x;
 });