diff --git a/src/components/molecules/NavBar.tsx b/src/components/molecules/NavBar.tsx
index 82a57a8a..e767dac1 100644
--- a/src/components/molecules/NavBar.tsx
+++ b/src/components/molecules/NavBar.tsx
@@ -67,15 +67,15 @@ export const NavBar: React.FC<NavBarProps> = ({ recordingName, isRecording }) =>
                       width: '140px',
                       borderRadius: '5px',
                       padding: '8px',
-                      background: '#ff00c3',
-                      color: 'white',
+                      background: 'white',
+                      color: '#ff00c3',
                       marginRight: '10px',
                       fontFamily: '"Roboto","Helvetica","Arial",sans-serif',
                       fontWeight: '500',
                       fontSize: '0.875rem',
                       lineHeight: '1.75',
                       letterSpacing: '0.02857em',
-                      '&:hover': { color: 'white', backgroundColor: '#ff00c3' }
+                      '&:hover': { backgroundColor: 'white', color: '#ff00c3' }
                     }} onClick={logout}>
                       <Logout sx={{ marginRight: '5px' }} />
                       Logout</IconButton>