diff --git a/client/src/components/Nav/SettingsTabs/Account/DeleteAccount.tsx b/client/src/components/Nav/SettingsTabs/Account/DeleteAccount.tsx
index d9c432c6a2..ee63ac9f0e 100644
--- a/client/src/components/Nav/SettingsTabs/Account/DeleteAccount.tsx
+++ b/client/src/components/Nav/SettingsTabs/Account/DeleteAccount.tsx
@@ -182,7 +182,7 @@ const renderDeleteButton = (
   <button
     className={cn(
       'mt-4 flex w-full items-center justify-center rounded-lg bg-surface-tertiary px-4 py-2 transition-all duration-200',
-      isLocked ? 'cursor-not-allowed opacity-30' : 'bg-destructive text-destructive-foreground',
+      isLocked ? 'cursor-not-allowed opacity-30' : 'bg-surface-destructive text-destructive-foreground',
     )}
     onClick={handleDeleteUser}
     disabled={isDeleting || isLocked}
diff --git a/client/src/components/Nav/SettingsTabs/DangerButton.tsx b/client/src/components/Nav/SettingsTabs/DangerButton.tsx
index 897e674d8b..ab5c8334b5 100644
--- a/client/src/components/Nav/SettingsTabs/DangerButton.tsx
+++ b/client/src/components/Nav/SettingsTabs/DangerButton.tsx
@@ -45,7 +45,7 @@ const DangerButton = (props: TDangerButtonProps, ref: ForwardedRef<HTMLButtonEle
         disabled={disabled}
         onClick={onClick}
         className={cn(
-          'btn relative border-none bg-red-500 text-white hover:bg-red-700 dark:hover:bg-red-700',
+          'btn relative border-none bg-surface-destructive text-white hover:bg-surface-destructive-hover',
           className,
         )}
       >
diff --git a/client/src/components/Nav/SettingsTabs/Data/ClearChats.tsx b/client/src/components/Nav/SettingsTabs/Data/ClearChats.tsx
index 44535e0a54..a8377af58c 100644
--- a/client/src/components/Nav/SettingsTabs/Data/ClearChats.tsx
+++ b/client/src/components/Nav/SettingsTabs/Data/ClearChats.tsx
@@ -54,7 +54,7 @@ export const ClearChats = () => {
           selection={{
             selectHandler: clearConvos,
             selectClasses:
-              'bg-destructive text-white transition-all duration-200 hover:bg-destructive/80',
+              'bg-surface-destructive text-white transition-all duration-200 hover:bg-surface-destructive-hover',
             selectText: clearConvosMutation.isLoading ? <Spinner /> : localize('com_ui_delete'),
           }}
         />
diff --git a/client/src/components/Nav/SettingsTabs/Data/DeleteCache.tsx b/client/src/components/Nav/SettingsTabs/Data/DeleteCache.tsx
index 48c7f3a434..60aad54560 100644
--- a/client/src/components/Nav/SettingsTabs/Data/DeleteCache.tsx
+++ b/client/src/components/Nav/SettingsTabs/Data/DeleteCache.tsx
@@ -62,7 +62,7 @@ export const DeleteCache = ({ disabled = false }: { disabled?: boolean }) => {
           selection={{
             selectHandler: revokeAllUserKeys,
             selectClasses:
-              'bg-destructive text-white transition-all duration-200 hover:bg-destructive/80',
+              'bg-surface-destructive text-white transition-all duration-200 hover:bg-surface-destructive-hover',
             selectText: isLoading ? <Spinner /> : localize('com_ui_delete'),
           }}
         />
diff --git a/client/src/components/Nav/SettingsTabs/Data/RevokeKeys.tsx b/client/src/components/Nav/SettingsTabs/Data/RevokeKeys.tsx
index 25147146ba..8d3650b907 100644
--- a/client/src/components/Nav/SettingsTabs/Data/RevokeKeys.tsx
+++ b/client/src/components/Nav/SettingsTabs/Data/RevokeKeys.tsx
@@ -62,7 +62,7 @@ export const RevokeKeys = ({
           selection={{
             selectHandler: onClick,
             selectClasses:
-              'bg-destructive text-white transition-all duration-200 hover:bg-destructive/80',
+              'bg-surface-destructive text-white transition-all duration-200 hover:bg-surface-destructive-hover',
             selectText: isLoading ? <Spinner /> : localize('com_ui_revoke'),
           }}
         />