diff --git a/demos/compose/src/main/java/androidx/media3/demo/compose/MainActivity.kt b/demos/compose/src/main/java/androidx/media3/demo/compose/MainActivity.kt
index 85423664bc..21d0de70a2 100644
--- a/demos/compose/src/main/java/androidx/media3/demo/compose/MainActivity.kt
+++ b/demos/compose/src/main/java/androidx/media3/demo/compose/MainActivity.kt
@@ -133,7 +133,7 @@ private fun MediaPlayerScreen(player: Player, modifier: Modifier = Modifier) {
 
     if (showControls) {
       // drawn on top of a potential shutter
-      MinimalControls(player, Modifier.align(Alignment.Center))
+      MinimalControls(player, Modifier.align(Alignment.Center).fillMaxWidth())
       ExtraControls(
         player,
         Modifier.fillMaxWidth()
diff --git a/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/MinimalControls.kt b/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/MinimalControls.kt
index cab552098c..fca27967ce 100644
--- a/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/MinimalControls.kt
+++ b/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/MinimalControls.kt
@@ -17,9 +17,8 @@
 package androidx.media3.demo.compose.buttons
 
 import androidx.compose.foundation.background
-import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.runtime.Composable
@@ -38,14 +37,14 @@ import androidx.media3.common.Player
 internal fun MinimalControls(player: Player, modifier: Modifier = Modifier) {
   val graySemiTransparentBackground = Color.Gray.copy(alpha = 0.1f)
   val modifierForIconButton =
-    modifier.size(80.dp).background(graySemiTransparentBackground, CircleShape)
-  Row(
-    modifier = modifier.fillMaxWidth(),
-    horizontalArrangement = Arrangement.SpaceEvenly,
-    verticalAlignment = Alignment.CenterVertically,
-  ) {
+    modifier.size(40.dp).background(graySemiTransparentBackground, CircleShape)
+  Row(modifier = modifier, verticalAlignment = Alignment.CenterVertically) {
+    Spacer(Modifier.weight(1f))
     PreviousButton(player, Modifier.weight(1f).then(modifierForIconButton))
+    Spacer(Modifier.weight(1f))
     PlayPauseButton(player, Modifier.weight(1f).then(modifierForIconButton))
+    Spacer(Modifier.weight(1f))
     NextButton(player, Modifier.weight(1f).then(modifierForIconButton))
+    Spacer(Modifier.weight(1f))
   }
 }
diff --git a/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/NextButton.kt b/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/NextButton.kt
index 4bd34ecb45..629cdaa626 100644
--- a/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/NextButton.kt
+++ b/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/NextButton.kt
@@ -16,10 +16,10 @@
 
 package androidx.media3.demo.compose.buttons
 
+import androidx.compose.foundation.clickable
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.SkipNext
 import androidx.compose.material3.Icon
-import androidx.compose.material3.IconButton
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
@@ -30,11 +30,9 @@ import androidx.media3.ui.compose.state.rememberNextButtonState
 @Composable
 internal fun NextButton(player: Player, modifier: Modifier = Modifier) {
   val state = rememberNextButtonState(player)
-  IconButton(onClick = state::onClick, modifier = modifier, enabled = state.isEnabled) {
-    Icon(
-      Icons.Default.SkipNext,
-      contentDescription = stringResource(R.string.next_button),
-      modifier = modifier,
-    )
-  }
+  Icon(
+    Icons.Default.SkipNext,
+    contentDescription = stringResource(R.string.next_button),
+    modifier = modifier.clickable(enabled = state.isEnabled, onClick = state::onClick),
+  )
 }
diff --git a/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/PlayPauseButton.kt b/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/PlayPauseButton.kt
index cfa0a408e0..f14a78cca5 100644
--- a/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/PlayPauseButton.kt
+++ b/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/PlayPauseButton.kt
@@ -16,11 +16,11 @@
 
 package androidx.media3.demo.compose.buttons
 
+import androidx.compose.foundation.clickable
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Pause
 import androidx.compose.material.icons.filled.PlayArrow
 import androidx.compose.material3.Icon
-import androidx.compose.material3.IconButton
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
@@ -35,7 +35,9 @@ internal fun PlayPauseButton(player: Player, modifier: Modifier = Modifier) {
   val contentDescription =
     if (state.showPlay) stringResource(R.string.playpause_button_play)
     else stringResource(R.string.playpause_button_pause)
-  IconButton(onClick = state::onClick, modifier = modifier, enabled = state.isEnabled) {
-    Icon(icon, contentDescription = contentDescription, modifier = modifier)
-  }
+  Icon(
+    icon,
+    contentDescription = contentDescription,
+    modifier = modifier.clickable(enabled = state.isEnabled, onClick = state::onClick),
+  )
 }
diff --git a/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/PreviousButton.kt b/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/PreviousButton.kt
index 254d94f49f..f3e5e95595 100644
--- a/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/PreviousButton.kt
+++ b/demos/compose/src/main/java/androidx/media3/demo/compose/buttons/PreviousButton.kt
@@ -16,10 +16,10 @@
 
 package androidx.media3.demo.compose.buttons
 
+import androidx.compose.foundation.clickable
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.SkipPrevious
 import androidx.compose.material3.Icon
-import androidx.compose.material3.IconButton
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
@@ -30,11 +30,9 @@ import androidx.media3.ui.compose.state.rememberPreviousButtonState
 @Composable
 internal fun PreviousButton(player: Player, modifier: Modifier = Modifier) {
   val state = rememberPreviousButtonState(player)
-  IconButton(onClick = state::onClick, modifier = modifier, enabled = state.isEnabled) {
-    Icon(
-      Icons.Default.SkipPrevious,
-      contentDescription = stringResource(R.string.previous_button),
-      modifier = modifier,
-    )
-  }
+  Icon(
+    Icons.Default.SkipPrevious,
+    contentDescription = stringResource(R.string.previous_button),
+    modifier = modifier.clickable(enabled = state.isEnabled, onClick = state::onClick),
+  )
 }