diff --git a/src/assets/scss/utils/_root.scss b/src/assets/scss/utils/_root.scss
index ba7c3b4..2a04789 100644
--- a/src/assets/scss/utils/_root.scss
+++ b/src/assets/scss/utils/_root.scss
@@ -1,10 +1,18 @@
 @use "sass:list";
 
+@mixin root() {
+  $host-selector: if($enable-host, ":host", ":root");
+
+  #{$host-selector} {
+    @content;
+  }
+}
+
 /*******************************
 *   Root variables extensions
 ********************************/
 
-:root {
+@include root() {
   // define color variables
   @each $name, $color in $colors {
     @if type-of($color) == list {
diff --git a/src/assets/scss/utils/_variables.scss b/src/assets/scss/utils/_variables.scss
index 504d59c..428231e 100644
--- a/src/assets/scss/utils/_variables.scss
+++ b/src/assets/scss/utils/_variables.scss
@@ -4,6 +4,7 @@
 
 // Settings
 $prefix: "oruga-" !default;
+$enable-host: false !default;
 
 // Animations
 $animation-speed: 150ms !default;