diff --git a/.changeset/fast-onions-obey.md b/.changeset/fast-onions-obey.md
new file mode 100644
index 00000000000..4e72dc94bee
--- /dev/null
+++ b/.changeset/fast-onions-obey.md
@@ -0,0 +1,5 @@
+---
+"thirdweb": patch
+---
+
+default the spinner stroke color to currentColor and make the color prop optional
diff --git a/packages/thirdweb/src/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatScreenContent.tsx b/packages/thirdweb/src/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatScreenContent.tsx
index 3e6d83954e2..9ccc4a29a31 100644
--- a/packages/thirdweb/src/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatScreenContent.tsx
+++ b/packages/thirdweb/src/react/web/ui/ConnectWallet/screens/Buy/fiat/FiatScreenContent.tsx
@@ -250,7 +250,7 @@ export function FiatScreenContent(props: {
         {fiatQuoteQuery.isLoading ? (
           <>
             Getting price quote
-            <Spinner size="sm" color="accentButtonText" />
+            <Spinner size="sm" />
           </>
         ) : (
           "Continue"
diff --git a/packages/thirdweb/src/react/web/ui/ConnectWallet/screens/Buy/swap/SwapScreenContent.tsx b/packages/thirdweb/src/react/web/ui/ConnectWallet/screens/Buy/swap/SwapScreenContent.tsx
index 2c24a96b6be..b18a51de17d 100644
--- a/packages/thirdweb/src/react/web/ui/ConnectWallet/screens/Buy/swap/SwapScreenContent.tsx
+++ b/packages/thirdweb/src/react/web/ui/ConnectWallet/screens/Buy/swap/SwapScreenContent.tsx
@@ -360,7 +360,7 @@ export function SwapScreenContent(props: {
           {quoteQuery.isLoading ? (
             <>
               Getting price quote
-              <Spinner size="sm" color="accentButtonText" />
+              <Spinner size="sm" />
             </>
           ) : (
             "Continue"
diff --git a/packages/thirdweb/src/react/web/ui/components/Spinner.tsx b/packages/thirdweb/src/react/web/ui/components/Spinner.tsx
index 89d42257d3b..71315386abb 100644
--- a/packages/thirdweb/src/react/web/ui/components/Spinner.tsx
+++ b/packages/thirdweb/src/react/web/ui/components/Spinner.tsx
@@ -9,8 +9,8 @@ import { StyledCircle, StyledSvg } from "../design-system/elements.js";
  * @internal
  */
 export const Spinner: React.FC<{
-  color: keyof Theme["colors"];
   size: keyof typeof iconSize;
+  color?: keyof Theme["colors"];
 }> = (props) => {
   const theme = useCustomTheme();
   return (
@@ -26,7 +26,7 @@ export const Spinner: React.FC<{
         cy="25"
         r="20"
         fill="none"
-        stroke={theme.colors[props.color]}
+        stroke={props.color ? theme.colors[props.color] : "currentColor"}
         strokeWidth={Number(iconSize[props.size]) > 64 ? "2" : "4"}
       />
     </Svg>