diff --git a/services/web/public/stylesheets/app/editor.less b/services/web/public/stylesheets/app/editor.less
index 1c45fd6a1c..ccd03aea47 100644
--- a/services/web/public/stylesheets/app/editor.less
+++ b/services/web/public/stylesheets/app/editor.less
@@ -276,8 +276,9 @@
 		-moz-osx-font-smoothing: grayscale;
 		font-size: 16px !important;
 		line-height: 50px;
+		background-color: @editor-toggler-bg-color;
 		&:hover {
-			background-color: #ddd;
+			background-color: @editor-toggler-hover-bg-color;
 			color: #333;
 		}
 	}
@@ -299,21 +300,26 @@
 		transparent (@extra-hit-area + 1px),
 		transparent);
 
-	// .ui-layout-toggler {
-	// 	color: #999;
-	// 	font-family: FontAwesome;
-	// 	font-style: normal;
-	// 	font-weight: normal;
-	// 	line-height: 1;
-	// 	-webkit-font-smoothing: antialiased;
-	// 	-moz-osx-font-smoothing: grayscale;
-	// 	font-size: 16px !important;
-	// 	line-height: 50px;
-	// 	&:hover {
-	// 		background-color: #ddd;
-	// 		color: #333;
-	// 	}
-	// }
+	.ui-layout-toggler {
+		padding: 0 @extra-hit-area !important;
+		background-image: linear-gradient(90deg, 
+			transparent,
+			transparent (@extra-hit-area - 1px),
+			@editor-toggler-bg-color (@extra-hit-area - 1px),
+			@editor-toggler-bg-color (@extra-hit-area + 1px),
+			transparent (@extra-hit-area + 1px),
+			transparent);
+
+		&:hover {
+			background-image: linear-gradient(90deg, 
+				transparent,
+				transparent (@extra-hit-area - 2px),
+				@editor-toggler-hover-bg-color (@extra-hit-area - 2px),
+				@editor-toggler-hover-bg-color (@extra-hit-area + 2px),
+				transparent (@extra-hit-area + 2px),
+				transparent);
+		}
+	}
 }
 
 .ui-layout-resizer-west.ui-layout-resizer-open, .ui-layout-resizer-east.ui-layout-resizer-closed {
diff --git a/services/web/public/stylesheets/core/_common-variables.less b/services/web/public/stylesheets/core/_common-variables.less
index 3689e6c10e..d4f5a168ec 100644
--- a/services/web/public/stylesheets/core/_common-variables.less
+++ b/services/web/public/stylesheets/core/_common-variables.less
@@ -919,6 +919,8 @@
 // Editor resizers
 @editor-resizer-bg-color          : #F4F4F4;
 @editor-resizer-bg-color-dragging : #ddd;
+@editor-toggler-bg-color          : transparent;
+@editor-toggler-hover-bg-color    : #DDD;
 @synctex-controls-z-index         : 3;
 @synctex-controls-padding         : 0 2px;
 // Tags
diff --git a/services/web/public/stylesheets/core/ol-variables.less b/services/web/public/stylesheets/core/ol-variables.less
index 4452e0e956..e86b9de8a7 100644
--- a/services/web/public/stylesheets/core/ol-variables.less
+++ b/services/web/public/stylesheets/core/ol-variables.less
@@ -187,6 +187,8 @@
 // Editor resizers
 @editor-resizer-bg-color          : @ol-blue-gray-6;
 @editor-resizer-bg-color-dragging : transparent;
+@editor-toggler-bg-color          : @ol-blue-gray-2;
+@editor-toggler-hover-bg-color    : @ol-green;
 @synctex-controls-z-index         : 6;
 @synctex-controls-padding         : 0;
 //== Colors