diff --git a/CHANGELOG.md b/CHANGELOG.md
index ff398bf28..029fde674 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -12,6 +12,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 * Changes to show all index patterns in index permission panel in role view ([#1303](https://github.com/opensearch-project/security-dashboards-plugin/issues/1303),[#1891](https://github.com/opensearch-project/security-dashboards-plugin/issues/1891))
 * Added missing index permissions in the list ([#1969](https://github.com/opensearch-project/security-dashboards-plugin/issues/1969))
+* Update account nav button style when nav group home enabled ([#2279](https://github.com/opensearch-project/security-dashboards-plugin/issues/2279))
 
 
 ### Bug Fixes
diff --git a/public/apps/account/account-nav-button.scss b/public/apps/account/account-nav-button.scss
deleted file mode 100644
index b8b1150cc..000000000
--- a/public/apps/account/account-nav-button.scss
+++ /dev/null
@@ -1,9 +0,0 @@
-/*
- * Copyright OpenSearch Contributors
- * SPDX-License-Identifier: Apache-2.0
- */
-
-// stylelint-disable-next-line @osd/stylelint/no_modifying_global_selectors
-.euiButtonEmpty.accountNavButton {
-  border: 0;
-}
diff --git a/public/apps/account/account-nav-button.tsx b/public/apps/account/account-nav-button.tsx
index 4f0f13508..6d35bafda 100644
--- a/public/apps/account/account-nav-button.tsx
+++ b/public/apps/account/account-nav-button.tsx
@@ -36,7 +36,7 @@ import { LogoutButton } from './log-out-button';
 import { resolveTenantName } from '../configuration/utils/tenant-utils';
 import { getShouldShowTenantPopup, setShouldShowTenantPopup } from '../../utils/storage-utils';
 import { getDashboardsInfo } from '../../utils/dashboards-info-utils';
-import './account-nav-button.scss';
+import { LeftBottomActionButton } from '../../../../../src/core/public';
 
 export function AccountNavButton(props: {
   coreStart: CoreStart;
@@ -173,15 +173,12 @@ export function AccountNavButton(props: {
 
   // ToDo: Add aria-label and tooltip when isPlacedInLeftNav is true
   const innerElement = isPlacedInLeftNav ? (
-    <EuiButtonEmpty
-      size="xs"
-      flush="both"
-      className="accountNavButton"
-      aria-expanded={isPopoverOpen}
-      aria-haspopup="true"
-    >
-      <EuiAvatar name={username} size="s" />
-    </EuiButtonEmpty>
+    <LeftBottomActionButton
+      title={username}
+      icon={<EuiAvatar name={username} size="s" />}
+      isNavDrawerLocked$={props.coreStart.chrome.getIsNavDrawerLocked$()}
+      isChromeVisible$={props.coreStart.chrome.getIsVisible$()}
+    />
   ) : (
     <EuiAvatar name={username} size="m" />
   );
@@ -191,7 +188,6 @@ export function AccountNavButton(props: {
       <EuiPopover
         data-test-subj="account-popover"
         id="actionsMenu"
-        anchorPosition={isPlacedInLeftNav ? 'rightDown' : undefined}
         button={innerElement}
         isOpen={isPopoverOpen}
         closePopover={() => {
@@ -201,6 +197,10 @@ export function AccountNavButton(props: {
         onClick={() => {
           setPopoverOpen((prevState) => !prevState);
         }}
+        // Use buffer 0 to avoid popover move to top center of anchor
+        {...(isPlacedInLeftNav
+          ? { anchorPosition: 'rightDown', buffer: 0, repositionOnScroll: true }
+          : {})}
       >
         <EuiContextMenuPanel>{contextMenuPanel}</EuiContextMenuPanel>
       </EuiPopover>