diff --git a/includes/templates/Sidebar.mustache b/includes/templates/Sidebar.mustache
index 18d03847..e4578ed0 100644
--- a/includes/templates/Sidebar.mustache
+++ b/includes/templates/Sidebar.mustache
@@ -26,8 +26,8 @@
 		mw-checkbox-hack-button
 		mw-ui-icon
 		mw-ui-icon-element
-		{{#sidebar-visible}}mw-ui-icon-wikimedia-collapseHorizontal-base20{{/sidebar-visible}}
-		{{^sidebar-visible}}mw-ui-icon-wikimedia-menu-base20{{/sidebar-visible}}
+		{{#sidebar-visible}}mw-ui-icon-wikimedia-collapseHorizontal{{/sidebar-visible}}
+		{{^sidebar-visible}}mw-ui-icon-wikimedia-menu{{/sidebar-visible}}
 	"
 	for="mw-sidebar-checkbox"
 	data-event-name="ui.sidebar">
diff --git a/resources/skins.vector.js/skin.js b/resources/skins.vector.js/skin.js
index 459b13b8..4ed5737d 100644
--- a/resources/skins.vector.js/skin.js
+++ b/resources/skins.vector.js/skin.js
@@ -12,13 +12,13 @@ var vector = require( '../skins.vector.legacy.js/vector.js' );
 function updateMenuIcon( checkbox, button ) {
 	button.classList.remove(
 		checkbox.checked ?
-			'mw-ui-icon-wikimedia-menu-base20' :
-			'mw-ui-icon-wikimedia-collapseHorizontal-base20'
+			'mw-ui-icon-wikimedia-menu' :
+			'mw-ui-icon-wikimedia-collapseHorizontal'
 	);
 	button.classList.add(
 		checkbox.checked ?
-			'mw-ui-icon-wikimedia-collapseHorizontal-base20' :
-			'mw-ui-icon-wikimedia-menu-base20'
+			'mw-ui-icon-wikimedia-collapseHorizontal' :
+			'mw-ui-icon-wikimedia-menu'
 	);
 }
 
diff --git a/resources/skins.vector.styles/Sidebar.less b/resources/skins.vector.styles/Sidebar.less
index 782a63b2..1cea04cd 100644
--- a/resources/skins.vector.styles/Sidebar.less
+++ b/resources/skins.vector.styles/Sidebar.less
@@ -36,6 +36,7 @@
 		height: @size-sidebar-button;
 		border: 1px solid transparent;
 		border-radius: @border-radius-base;
+		.transition( background-color @transition-duration-base, border-color @transition-duration-base, box-shadow @transition-duration-base, opacity @transition-duration-base; );
 
 		&:before {
 			// FIXME: the icon itself is supposed to be 20px. mediawiki.ui uses 24px.
@@ -45,14 +46,17 @@
 			height: 100%;
 			// Center it horizontally.
 			margin: 0 12px;
-			opacity: 0.87;
+			// Equals `#555`, closest to `#54595d` on background-color `#fff`.
+			opacity: 0.67;
 		}
 
 		&:hover {
 			background-color: @background-color-frameless--hover;
-		}
 
-		.transition( background-color @transition-duration-base, border-color @transition-duration-base, box-shadow @transition-duration-base; );
+			&:before {
+				opacity: 1;
+			}
+		}
 	}
 
 	.mw-checkbox-hack-checkbox:focus ~ .mw-checkbox-hack-button {
diff --git a/skin.json b/skin.json
index db6208a6..8dd12fa1 100644
--- a/skin.json
+++ b/skin.json
@@ -60,8 +60,7 @@
 		},
 		"skins.vector.icons": {
 			"class": "ResourceLoaderImageModule",
-			"selector": ".mw-ui-icon-wikimedia-{name}-base20:before",
-			"defaultColor": "#54595d",
+			"selector": ".mw-ui-icon-wikimedia-{name}:before",
 			"images": {
 				"menu": "resources/skins.vector.icons/menu.svg",
 				"collapseHorizontal": "resources/skins.vector.icons/collapseHorizontal.svg"