diff --git a/packages/desktop-client/src/components/Notifications.tsx b/packages/desktop-client/src/components/Notifications.tsx
index 69c6450fd2485b532c43d55869a26245ab676ac6..02baf1150a81c10d2b523173a9f1f3a77eef607d 100644
--- a/packages/desktop-client/src/components/Notifications.tsx
+++ b/packages/desktop-client/src/components/Notifications.tsx
@@ -11,7 +11,7 @@ import { type CSSProperties } from 'glamor';
 import type { NotificationWithId } from 'loot-core/src/client/state-types/notifications';
 
 import { useActions } from '../hooks/useActions';
-import Loading from '../icons/AnimatedLoading';
+import AnimatedLoading from '../icons/AnimatedLoading';
 import Delete from '../icons/v0/Delete';
 import { styles, colors } from '../style';
 
@@ -210,8 +210,7 @@ function Notification({
             justifyContent: 'center',
           }}
         >
-          <Loading
-            color="currentColor"
+          <AnimatedLoading
             style={{ width: 20, height: 20, color: 'currentColor' }}
           />
         </View>
diff --git a/packages/desktop-client/src/components/accounts/Header.js b/packages/desktop-client/src/components/accounts/Header.js
index fe0c97335e49c1c3cb82f52bc3e98528f2b329bf..7b1cd9116fedf151c794d0883c2aa249f1d9b0d0 100644
--- a/packages/desktop-client/src/components/accounts/Header.js
+++ b/packages/desktop-client/src/components/accounts/Header.js
@@ -1,7 +1,7 @@
 import React, { useState, useRef } from 'react';
 
 import useSyncServerStatus from '../../hooks/useSyncServerStatus';
-import Loading from '../../icons/AnimatedLoading';
+import AnimatedLoading from '../../icons/AnimatedLoading';
 import Add from '../../icons/v1/Add';
 import ArrowsExpand3 from '../../icons/v2/ArrowsExpand3';
 import ArrowsShrink3 from '../../icons/v2/ArrowsShrink3';
@@ -288,7 +288,10 @@ export function AccountHeader({
           />
           {workingHard ? (
             <View>
-              <Loading color={colors.n1} style={{ width: 16, height: 16 }} />
+              <AnimatedLoading
+                color={colors.n1}
+                style={{ width: 16, height: 16 }}
+              />
             </View>
           ) : (
             <SelectedTransactionsButton
diff --git a/packages/desktop-client/src/components/common/Button.tsx b/packages/desktop-client/src/components/common/Button.tsx
index d800947fe1e658abb86d4e3bf15f93c430647531..3655496390f07d7e0676ad95e585fc153f0e46a2 100644
--- a/packages/desktop-client/src/components/common/Button.tsx
+++ b/packages/desktop-client/src/components/common/Button.tsx
@@ -2,7 +2,7 @@ import React, { forwardRef } from 'react';
 
 import { css, type CSSProperties } from 'glamor';
 
-import Loading from '../../icons/AnimatedLoading';
+import AnimatedLoading from '../../icons/AnimatedLoading';
 import { styles, colors } from '../../style';
 import { type HTMLPropsWithStyle } from '../../types/utils';
 
@@ -137,7 +137,7 @@ export const ButtonWithLoading = forwardRef<
             justifyContent: 'center',
           }}
         >
-          <Loading color="inherit" style={{ width: 20, height: 20 }} />
+          <AnimatedLoading style={{ width: 20, height: 20 }} />
         </View>
       )}
       <View
diff --git a/packages/desktop-client/src/components/common/Modal.tsx b/packages/desktop-client/src/components/common/Modal.tsx
index 8c99af242b60401c2861a4782f125627b27c8d23..ecbee88e04a537351a363c9f9f2954fa0e40fa26 100644
--- a/packages/desktop-client/src/components/common/Modal.tsx
+++ b/packages/desktop-client/src/components/common/Modal.tsx
@@ -9,7 +9,7 @@ import ReactModal from 'react-modal';
 import type { CSSProperties } from 'glamor';
 import hotkeys from 'hotkeys-js';
 
-import Loading from '../../icons/AnimatedLoading';
+import AnimatedLoading from '../../icons/AnimatedLoading';
 import Delete from '../../icons/v0/Delete';
 import { styles, colors } from '../../style';
 import tokens from '../../tokens';
@@ -217,7 +217,10 @@ const Modal = ({
               zIndex: 1000,
             }}
           >
-            <Loading style={{ width: 20, height: 20 }} color={colors.n1} />
+            <AnimatedLoading
+              style={{ width: 20, height: 20 }}
+              color={colors.n1}
+            />
           </View>
         )}
       </ModalContent>
diff --git a/packages/desktop-client/src/icons/Loading.js b/packages/desktop-client/src/icons/Loading.js
index 659de753da05394fe807b4b89785c1c1128ae27b..332f6cebc512de6f6b1088b57ca0a9bb794c3928 100644
--- a/packages/desktop-client/src/icons/Loading.js
+++ b/packages/desktop-client/src/icons/Loading.js
@@ -1,7 +1,7 @@
 import React, { useState } from 'react';
 
 const SvgLoading = props => {
-  let { color = '#fff' } = props;
+  let { color = 'currentColor' } = props;
   let [gradientId] = useState('gradient-' + Math.random());
 
   return (
diff --git a/upcoming-release-notes/1390.md b/upcoming-release-notes/1390.md
new file mode 100644
index 0000000000000000000000000000000000000000..66e1e68ad37aab9a139b34bb6fee342855528b49
--- /dev/null
+++ b/upcoming-release-notes/1390.md
@@ -0,0 +1,6 @@
+---
+category: Maintenance
+authors: [j-f1]
+---
+
+Consistency improvements for `<AnimatedLoading>`