diff --git a/frappe/public/scss/desk/css_variables.scss b/frappe/public/scss/desk/css_variables.scss
index 135bb7a9f5..5bb2614dcc 100644
--- a/frappe/public/scss/desk/css_variables.scss
+++ b/frappe/public/scss/desk/css_variables.scss
@@ -13,6 +13,14 @@ $input-height: 28px !default;
 	--text-2xl: 20px;
 	--text-3xl: 22px;
 
+	// breakpoints
+	--xxl-width: map-get($grid-breakpoints, '2xl');
+	--xl-width: map-get($grid-breakpoints, 'xl');
+	--lg-width: map-get($grid-breakpoints, 'lg');
+	--md-width: map-get($grid-breakpoints, 'md');
+	--sm-width: map-get($grid-breakpoints, 'sm');
+	--xs-width: map-get($grid-breakpoints, 'xs');
+
 	--text-bold: 500;
 
 	--navbar-height: 60px;