diff --git a/scss/_navbar.scss b/scss/_navbar.scss
index 2c5ce350ac..4f2229db95 100644
--- a/scss/_navbar.scss
+++ b/scss/_navbar.scss
@@ -206,6 +206,7 @@
 
   .navbar-toggler {
     background-image: $navbar-light-toggler-bg;
+    border-color: $navbar-light-toggler-border;
   }
 
   .navbar-divider {
@@ -245,6 +246,7 @@
 
   .navbar-toggler {
     background-image: $navbar-dark-toggler-bg;
+    border-color: $navbar-dark-toggler-border;
   }
 
   .navbar-divider {
diff --git a/scss/_variables.scss b/scss/_variables.scss
index c6c757aa96..6f549f5e2b 100644
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -512,13 +512,14 @@ $navbar-dark-hover-color:           rgba(255,255,255,.75) !default;
 $navbar-dark-active-color:          rgba(255,255,255,1) !default;
 $navbar-dark-disabled-color:        rgba(255,255,255,.25) !default;
 $navbar-dark-toggler-bg: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='#{$navbar-dark-color}' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E") !default;
+$navbar-dark-toggler-border:        rgba(255,255,255,.1) !default;
 
 $navbar-light-color:                rgba(0,0,0,.5) !default;
 $navbar-light-hover-color:          rgba(0,0,0,.7) !default;
 $navbar-light-active-color:         rgba(0,0,0,.9) !default;
 $navbar-light-disabled-color:       rgba(0,0,0,.3) !default;
 $navbar-light-toggler-bg: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='#{$navbar-light-color}' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E") !default;
-
+$navbar-light-toggler-border:       rgba(0,0,0,.1) !default;
 
 // Navs