diff --git a/src/frontend/src/features/recording/components/RecordingStateToast.tsx b/src/frontend/src/features/recording/components/RecordingStateToast.tsx
index a29bd4f4..f2c9766e 100644
--- a/src/frontend/src/features/recording/components/RecordingStateToast.tsx
+++ b/src/frontend/src/features/recording/components/RecordingStateToast.tsx
@@ -1,9 +1,7 @@
 import { css } from '@/styled-system/css'
 import { useTranslation } from 'react-i18next'
-import { Spinner } from '@/primitives/Spinner'
 import { useMemo } from 'react'
 import { Text } from '@/primitives'
-import { RiRecordCircleLine } from '@remixicon/react'
 import {
   RecordingMode,
   useHasRecordingAccess,
@@ -13,6 +11,7 @@ import { FeatureFlags } from '@/features/analytics/enums'
 import { Button as RACButton } from 'react-aria-components'
 import { useSidePanel } from '@/features/rooms/livekit/hooks/useSidePanel'
 import { useRoomMetadata } from '../hooks/useRoomMetadata'
+import { RecordingStatusIcon } from './RecordingStatusIcon'
 
 export const RecordingStateToast = () => {
   const { t } = useTranslation('rooms', {
@@ -83,16 +82,10 @@ export const RecordingStateToast = () => {
         gap: '0.5rem',
       })}
     >
-      {isStarted ? (
-        <RiRecordCircleLine
-          size={20}
-          className={css({
-            animation: 'pulse_background 1s infinite',
-          })}
-        />
-      ) : (
-        <Spinner size={20} variant="dark" />
-      )}
+      <RecordingStatusIcon
+        isStarted={isStarted}
+        isTranscriptActive={isTranscriptActive}
+      />
 
       {!hasScreenRecordingAccessAndActive && !hasTranscriptAccessAndActive && (
         <Text
diff --git a/src/frontend/src/features/recording/components/RecordingStatusIcon.tsx b/src/frontend/src/features/recording/components/RecordingStatusIcon.tsx
new file mode 100644
index 00000000..64bf85f3
--- /dev/null
+++ b/src/frontend/src/features/recording/components/RecordingStatusIcon.tsx
@@ -0,0 +1,21 @@
+import { Spinner } from '@/primitives/Spinner'
+
+interface RecordingStatusIconProps {
+  isStarted: boolean
+  isTranscriptActive: boolean
+}
+
+export const RecordingStatusIcon = ({
+  isStarted,
+  isTranscriptActive,
+}: RecordingStatusIconProps) => {
+  if (!isStarted) {
+    return <Spinner size={20} variant="dark" />
+  }
+
+  if (isTranscriptActive) {
+    return <span className="material-symbols">speech_to_text</span>
+  }
+
+  return <span className="material-symbols">screen_record</span>
+}