diff --git a/src/frontend/src/features/recording/components/RecordingStateToast.tsx b/src/frontend/src/features/recording/components/RecordingStateToast.tsx
index eeb32aae..c9b2d0c3 100644
--- a/src/frontend/src/features/recording/components/RecordingStateToast.tsx
+++ b/src/frontend/src/features/recording/components/RecordingStateToast.tsx
@@ -107,7 +107,7 @@ export const RecordingStateToast = () => {
         left: '10px',
         paddingY: '0.25rem',
         paddingX: '0.75rem 0.75rem',
-        backgroundColor: 'primaryDark.100',
+        backgroundColor: 'danger.700',
         borderColor: 'white',
         border: '1px solid',
         color: 'white',
diff --git a/src/frontend/src/primitives/Spinner.tsx b/src/frontend/src/primitives/Spinner.tsx
index 0c98a271..cc1e8513 100644
--- a/src/frontend/src/primitives/Spinner.tsx
+++ b/src/frontend/src/primitives/Spinner.tsx
@@ -31,7 +31,7 @@ export const Spinner = ({
               strokeDashoffset={0}
               strokeLinecap="round"
               className={css({
-                stroke: variant == 'light' ? 'primary.100' : 'primaryDark.100',
+                stroke: variant == 'light' ? 'primary.100' : 'transparent',
               })}
               style={{}}
             />