diff --git a/_sass/base/_global.scss b/_sass/base/_global.scss
index f1d9a3d5b0..24bcfaeb61 100644
--- a/_sass/base/_global.scss
+++ b/_sass/base/_global.scss
@@ -1,3 +1,5 @@
+@use 'variables' as *;
+
 * {
   margin: 0;
   padding: 0;
diff --git a/_sass/base/_highlight.scss b/_sass/base/_highlight.scss
index 79b924c328..75bb27e018 100644
--- a/_sass/base/_highlight.scss
+++ b/_sass/base/_highlight.scss
@@ -1,6 +1,7 @@
 // ==========================================================================
 //   Syntax highlighting
 // ==========================================================================
+@use 'variables' as *;
 
 div.highlighter-rouge,
 figure.highlight,
diff --git a/_sass/base/_utility.scss b/_sass/base/_utility.scss
index a067f47a9d..66495d6551 100644
--- a/_sass/base/_utility.scss
+++ b/_sass/base/_utility.scss
@@ -1,3 +1,5 @@
+@use 'variables' as *;
+
 // Mix-ins
 %padding-nav {
   padding: $padding-small $padding-x-large;
diff --git a/_sass/type-on-strap.scss b/_sass/type-on-strap.scss
index 9401cbdc90..9d7682e564 100644
--- a/_sass/type-on-strap.scss
+++ b/_sass/type-on-strap.scss
@@ -1,8 +1,7 @@
 /* TYPE_ON_STRAP Main style sheet */
 
-/* Variables */
-// All the options to customize your theme in one file
-@import 'base/variables';
+/* Base */
+@use 'base/index' as base;
 
 /* External */
 // CSS from external sources
@@ -12,11 +11,6 @@
 @import 'external/katex';
 @import 'external/source-sans-pro';
 
-/* Base */
-// For general CSS in the theme
-@import 'base/global';
-@import 'base/highlight';
-@import 'base/utility';
 
 /* Includes */
 // Linked with the html in the _includes folder