diff --git a/src/Umbraco.Web.UI.Client/src/less/sections.less b/src/Umbraco.Web.UI.Client/src/less/sections.less
index 51ec5c7436..ba158bc710 100644
--- a/src/Umbraco.Web.UI.Client/src/less/sections.less
+++ b/src/Umbraco.Web.UI.Client/src/less/sections.less
@@ -89,6 +89,10 @@ ul.sections li.avatar a img {
 	width: 30px;
 }
 
+ul.sections li.avatar a span {
+	opacity: 1;
+}
+
 .faded ul.sections li {
 	opacity: 0.4
 }
diff --git a/src/Umbraco.Web.UI.Client/src/views/components/application/umb-sections.html b/src/Umbraco.Web.UI.Client/src/views/components/application/umb-sections.html
index e4fde787da..e9d50939f2 100644
--- a/src/Umbraco.Web.UI.Client/src/views/components/application/umb-sections.html
+++ b/src/Umbraco.Web.UI.Client/src/views/components/application/umb-sections.html
@@ -5,6 +5,8 @@
                 <a href="#" ng-click="avatarClick()" hotkey="ctrl+shift+u" title="{{user.name}}" prevent-default>
                     <umb-avatar
                         size="xs"
+                        color="secondary"
+                        name="{{user.name}}"
                         img-src="{{avatar[0].value}}"
                         img-srcset="{{avatar[1].value}} 2x, {{avatar[2].value}} 3x">
                     </umb-avatar>