diff --git a/img/toolbar/back_btn.svg b/img/toolbar/back_btn.svg
index e9a30efa524..d8d233f3e67 100644
--- a/img/toolbar/back_btn.svg
+++ b/img/toolbar/back_btn.svg
@@ -1 +1,14 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 8.66 15.34"><defs><style>.cls-1{fill:none;stroke:#6d6e70;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.85px;}</style></defs><title>back_btn</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><polyline class="cls-1" points="7.74 14.41 0.93 7.6 7.6 0.93"/></g></g></svg>
\ No newline at end of file
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 20.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 8.7 15.3" style="enable-background:new 0 0 8.7 15.3;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:none;stroke:#6D6E70;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
+</style>
+<title>back_btn</title>
+<g id="Layer_2">
+	<g id="Layer_1-2">
+		<polyline class="st0" points="7.7,14.3 1,7.6 7.5,1.1 		"/>
+	</g>
+</g>
+</svg>
diff --git a/img/toolbar/forward_btn.svg b/img/toolbar/forward_btn.svg
index 38d9f821489..b27b5251796 100644
--- a/img/toolbar/forward_btn.svg
+++ b/img/toolbar/forward_btn.svg
@@ -1 +1,14 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 8.66 15.34"><defs><style>.cls-1{fill:none;stroke:#6d6e70;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.85px;}</style></defs><title>forward_btn</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><polyline class="cls-1" points="0.93 14.41 7.74 7.6 1.06 0.93"/></g></g></svg>
\ No newline at end of file
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 20.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 8.7 15.3" style="enable-background:new 0 0 8.7 15.3;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:none;stroke:#6D6E70;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
+</style>
+<title>forward_btn</title>
+<g id="Layer_2">
+	<g id="Layer_1-2">
+		<polyline class="st0" points="1,14.2 7.6,7.6 1.2,1.1 		"/>
+	</g>
+</g>
+</svg>
diff --git a/less/navigationBar.less b/less/navigationBar.less
index 790df4097ec..4efeb19d507 100644
--- a/less/navigationBar.less
+++ b/less/navigationBar.less
@@ -485,19 +485,9 @@
 
     .backButton,
     .forwardButton {
-    width: 20px;
-    margin-top: 5px;
-    }
-
-    .backButton {
-    padding-right:4px;
-    margin-left: 4px;
+      width: 100%;
     }
 
-    .forwardButton {
-    padding-left: 4px;
-    margin-left: 6px;
-    }
   }
 
   // Navigation bar at the center
@@ -536,10 +526,10 @@
 
     .extensionButton {
       -webkit-app-region: no-drag;
-    background-size: contain;
-    height: 17px;
-    margin: 4px 4px 0 0;
-    opacity: 0.85;
+      background-size: contain;
+      height: 17px;
+      margin: 4px 4px 0 0;
+      opacity: 0.85;
     }
 
     .braveMenu {
@@ -587,9 +577,9 @@
   margin-right: 6px;
 
   &.nav {
-  margin-left: 4px;
-  margin-right: 1px;
-  width: 34px;
+    margin-left: 4px;
+    margin-right: 1px;
+    width: 34px;
   }
 
   &:last-child {
@@ -604,44 +594,44 @@
 
 .backButton,
 .forwardButton {
-  height: 15px;
+  height: 24px;
   width: 30px;
-  margin-top: 5px;
+  margin: 0;
 }
 
 .backButton {
   background: url('../img/toolbar/back_btn.svg') center no-repeat;
-  margin-left: 4px;
+  background-size: 14px 14px;
 }
 
 .forwardButton {
   background: url('../img/toolbar/forward_btn.svg') center no-repeat;
-  margin-left: 4px;
+  background-size: 14px 14px;
 }
 
 #navigator {
+  .stopButton,
+  .reloadButton,
+  .homeButton {
+    margin: 0;
+    padding: 0;
+    width: 100%;
+    height: 100%;
+  }
+
   .stopButton {
     background: url('../img/toolbar/stoploading_btn.svg') center no-repeat;
-    margin: 0 3px 3px 3px;
-    padding: 0 6px;
-    height: 12px;
-    position: relative;
-    top: 3px;
+    background-size: 11px 11px;
   }
 
   .reloadButton {
     background: url('../img/toolbar/reload_btn.svg') center no-repeat;
-    margin: 0 3px -1px 3px;
-    padding: 0 4px;
-    position: relative;
+    background-size: 13px 13px;
   }
 
   .homeButton {
     background: url('../img/toolbar/home_btn.svg') center no-repeat;
-    width: 14px;
-    height: 13px;
-    padding: 0 6px;
-    position: relative;
+    background-size: 16px 16px;
   }
 
   .bookmarkButton {