diff --git a/frappe/public/js/frappe/utils/common.js b/frappe/public/js/frappe/utils/common.js
index 4b49c4e53e..ceb71a1bb1 100644
--- a/frappe/public/js/frappe/utils/common.js
+++ b/frappe/public/js/frappe/utils/common.js
@@ -1,6 +1,6 @@
 // common file between desk and website
 
-frappe.avatar = function (user, css_class, title, image_url = null, remove_avatar = false) {
+frappe.avatar = function (user, css_class, title, image_url = null, remove_avatar=false, remove_color=false) {
 	let user_info;
 	if (user) {
 		// desk
@@ -20,10 +20,10 @@ frappe.avatar = function (user, css_class, title, image_url = null, remove_avata
 		title = user_info.fullname;
 	}
 
-	return frappe.get_avatar(css_class, title, image_url || user_info.image);
+	return frappe.get_avatar(css_class, title, image_url || user_info.image, remove_color=remove_color);
 };
 
-frappe.get_avatar = function(css_class, title, image_url = null) {
+frappe.get_avatar = function(css_class, title, image_url = null, remove_color) {
 	if (!css_class) {
 		css_class = "avatar-small";
 	}
@@ -36,14 +36,19 @@ frappe.get_avatar = function(css_class, title, image_url = null) {
 					title="${title}"></span>
 			</span>`;
 	} else {
-		var abbr =  frappe.get_abbr(title);
-		var color = frappe.get_palette(title);
+		let abbr =  frappe.get_abbr(title);
+		let style = '';
+		if (!remove_color) {
+			let color = frappe.get_palette(title);
+			style = `background-color: var(${color[0]}); color: var(${color[1]})`
+		}
+
 		if (css_class === 'avatar-small' || css_class == 'avatar-xs') {
 			abbr = abbr.substr(0, 1);
 		}
 		return `<span class="avatar ${css_class}" title="${title}">
 			<div class="avatar-frame standard-image"
-				style="background-color: var(${color[0]}); color: var(${color[1]})">
+				style="${style}">
 					${abbr}
 			</div>
 		</span>`;
diff --git a/frappe/templates/includes/navbar/navbar_login.html b/frappe/templates/includes/navbar/navbar_login.html
index 554b8eba7c..a38b4f307d 100644
--- a/frappe/templates/includes/navbar/navbar_login.html
+++ b/frappe/templates/includes/navbar/navbar_login.html
@@ -3,10 +3,8 @@
 
 	{% if frappe.session.user != 'Guest' %}
 	<li class="nav-item dropdown logged-in" id="website-post-login" data-label="website-post-login" style="display: none">
-		<a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">
+		<a href="#" class="nav-link nav-avatar" data-toggle="dropdown">
 			<span class="user-image-wrapper"></span>
-			<span class="full-name"></span>
-			<b class="caret"></b>
 		</a>
 		<ul class="dropdown-menu dropdown-menu-right" role="menu">
 			{%- for child in post_login -%}
diff --git a/frappe/website/js/website.js b/frappe/website/js/website.js
index 785905e766..bcbf7f762f 100644
--- a/frappe/website/js/website.js
+++ b/frappe/website/js/website.js
@@ -211,12 +211,11 @@ $.extend(frappe, {
 		if (frappe.is_user_logged_in()) {
 			$(".btn-login-area").toggle(false);
 			$(".logged-in").toggle(true);
-			$(".full-name").html(frappe.get_cookie("full_name"));
 			$(".user-image").attr("src", frappe.get_cookie("user_image"));
 
-			$('.user-image-wrapper').html(frappe.avatar(null, 'avatar-small'));
-			$('.user-image-sidebar').html(frappe.avatar(null, 'avatar-small'));
-			$('.user-image-myaccount').html(frappe.avatar(null, 'avatar-large'));
+			$('.user-image-wrapper').html(frappe.avatar(null, 'avatar-medium', null, null, null, true));
+			$('.user-image-sidebar').html(frappe.avatar(null, 'avatar-medium', null, null, null, true));
+			$('.user-image-myaccount').html(frappe.avatar(null, 'avatar-large', null, null, null, true));
 		}
 	},
 	freeze_count: 0,