diff --git a/app/components/src/main/java/cc/wordview/app/components/ui/PlayerTopBar.kt b/app/components/src/main/java/cc/wordview/app/components/ui/PlayerTopBar.kt
index cfcbfc83..5425a25c 100644
--- a/app/components/src/main/java/cc/wordview/app/components/ui/PlayerTopBar.kt
+++ b/app/components/src/main/java/cc/wordview/app/components/ui/PlayerTopBar.kt
@@ -15,22 +15,28 @@ import androidx.compose.ui.Modifier
  * A composable function that displays a top bar for the WordView player with customizable content.
  *
  * @param modifier The [Modifier] to be applied to the top bar for layout customization. Defaults to an empty [Modifier].
- * @param content A composable function that defines the content to be displayed within the top bar.
+ * @param contentLeft A composable function that defines the content to be displayed on the left side of the top bar.
+ * @param contentRight A composable function that defines the content to be displayed on the right side of the top bar.
  */
 @OptIn(ExperimentalMaterial3Api::class)
 @Composable
-fun PlayerTopBar(modifier: Modifier = Modifier, content: @Composable () -> Unit) {
+fun PlayerTopBar(modifier: Modifier = Modifier, contentLeft: @Composable () -> Unit, contentRight: @Composable () -> Unit) {
     Box(
         modifier = modifier
             .fillMaxWidth()
             .height(TopAppBarDefaults.TopAppBarExpandedHeight),
-        contentAlignment = Alignment.TopStart,
     ) {
         Row(
-            modifier = Modifier.fillMaxHeight(),
+            modifier = Modifier.fillMaxHeight().align(Alignment.TopStart),
             verticalAlignment = Alignment.CenterVertically
         ) {
-            content()
+            contentLeft()
+        }
+        Row(
+            modifier = Modifier.fillMaxHeight().align(Alignment.TopEnd),
+            verticalAlignment = Alignment.CenterVertically
+        ) {
+            contentRight()
         }
     }
 }
\ No newline at end of file
diff --git a/app/src/main/java/cc/wordview/app/ui/activities/player/composables/Player.kt b/app/src/main/java/cc/wordview/app/ui/activities/player/composables/Player.kt
index c94c487e..34eec328 100644
--- a/app/src/main/java/cc/wordview/app/ui/activities/player/composables/Player.kt
+++ b/app/src/main/java/cc/wordview/app/ui/activities/player/composables/Player.kt
@@ -33,6 +33,8 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.ArrowBack
+import androidx.compose.material.icons.filled.ClosedCaption
+import androidx.compose.material.icons.filled.ClosedCaptionOff
 import androidx.compose.material.icons.filled.SkipNext
 import androidx.compose.material.icons.filled.SkipPrevious
 import androidx.compose.material3.ExperimentalMaterial3Api
@@ -44,6 +46,9 @@ import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.alpha
@@ -82,6 +87,8 @@ fun Player(videoId: String, viewModel: PlayerViewModel, innerPadding: PaddingVal
 
     val composerMode = AppSettings.composerMode.get()
 
+    var captionsEnabled by remember { mutableStateOf(true) }
+
     LaunchedEffect(uiState.finalized) {
         if (uiState.finalized) {
             uiState.player.stop()
@@ -107,7 +114,7 @@ fun Player(videoId: String, viewModel: PlayerViewModel, innerPadding: PaddingVal
             horizontalAlignment = Alignment.CenterHorizontally,
             verticalArrangement = Arrangement.Bottom
         ) {
-            TextCue(
+            if (captionsEnabled) TextCue(
                 modifier = Modifier
                     .zIndex(1f)
                     .padding(bottom = innerPadding.calculateBottomPadding() + 6.dp)
@@ -121,13 +128,17 @@ fun Player(videoId: String, viewModel: PlayerViewModel, innerPadding: PaddingVal
         }
 
         FadeOutBox(
-            modifier = Modifier.fillMaxSize().testTag("fade-out-box"),
+            modifier = Modifier
+                .fillMaxSize()
+                .testTag("fade-out-box"),
             disabled = composerMode,
             duration = 250,
             stagnationTime = 5000
         ) {
             Box(
-                modifier = Modifier.fillMaxHeight(0.25f).fillMaxWidth()
+                modifier = Modifier
+                    .fillMaxHeight(0.25f)
+                    .fillMaxWidth()
                     .background(
                         brush = Brush.verticalGradient(
                             colors = listOf(
@@ -137,36 +148,69 @@ fun Player(videoId: String, viewModel: PlayerViewModel, innerPadding: PaddingVal
                         )
                     )
             )
-            PlayerTopBar(Modifier
-                .padding(start = WindowInsets.displayCutout.getLeft(density, LayoutDirection.Ltr).dp / 2)
-                .padding(end = WindowInsets.displayCutout.getRight(density, LayoutDirection.Ltr).dp / 2),
-                ) {
-                IconButton(
-                    onClick = { back() },
-                    modifier = Modifier.testTag("back-button"),
-                ) {
-                    Icon(
-                        imageVector = Icons.Filled.ArrowBack,
-                        contentDescription = "Back"
-                    )
-                }
-                Column {
-                    Text(
-                        text = uiState.videoStream.info.name,
-                        fontSize = 18.sp
-                    )
-                    Text(
-                        text = uiState.videoStream.info.getCleanUploaderName(),
-                        fontSize = 12.sp
+            PlayerTopBar(
+                modifier = Modifier
+                    .padding(
+                        start = WindowInsets.displayCutout.getLeft(
+                            density,
+                            LayoutDirection.Ltr
+                        ).dp / 2
                     )
-                }
-            }
+                    .padding(
+                        end = WindowInsets.displayCutout.getRight(
+                            density,
+                            LayoutDirection.Ltr
+                        ).dp / 2
+                    ),
+                contentLeft = {
+                    IconButton(
+                        onClick = { back() },
+                        modifier = Modifier.testTag("back-button"),
+                    ) {
+                        Icon(
+                            imageVector = Icons.Filled.ArrowBack,
+                            contentDescription = "Back"
+                        )
+                    }
+                    Column {
+                        Text(
+                            text = uiState.videoStream.info.name,
+                            fontSize = 18.sp
+                        )
+                        Text(
+                            text = uiState.videoStream.info.getCleanUploaderName(),
+                            fontSize = 12.sp
+                        )
+                    }
+                },
+                contentRight = {
+                    IconButton(
+                        onClick = { captionsEnabled = !captionsEnabled },
+                        modifier = Modifier.testTag("cc-toggle-button"),
+                    ) {
+                        Icon(
+                            imageVector = if (captionsEnabled) Icons.Filled.ClosedCaption else Icons.Filled.ClosedCaptionOff,
+                            contentDescription = "Back"
+                        )
+                    }
+                },
+            )
             Seekbar(
                 modifier = Modifier
                     .padding(top = TopAppBarDefaults.TopAppBarExpandedHeight)
                     .padding(horizontal = 6.dp)
-                    .padding(start = WindowInsets.displayCutout.getLeft(density, LayoutDirection.Ltr).dp / 2)
-                    .padding(end = WindowInsets.displayCutout.getRight(density, LayoutDirection.Ltr).dp / 2),
+                    .padding(
+                        start = WindowInsets.displayCutout.getLeft(
+                            density,
+                            LayoutDirection.Ltr
+                        ).dp / 2
+                    )
+                    .padding(
+                        end = WindowInsets.displayCutout.getRight(
+                            density,
+                            LayoutDirection.Ltr
+                        ).dp / 2
+                    ),
                 displayAdvancedInformation = composerMode,
                 currentPosition = currentPosition,
                 duration = uiState.player.getDuration(),