diff --git a/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/avatar/Avatar.kt b/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/avatar/Avatar.kt
index 5a63eaa7ec..173716aee3 100644
--- a/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/avatar/Avatar.kt
+++ b/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/avatar/Avatar.kt
@@ -28,11 +28,13 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.layout.ContentScale
+import androidx.compose.ui.platform.LocalInspectionMode
 import androidx.compose.ui.semantics.clearAndSetSemantics
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
+import coil.compose.AsyncImage
 import coil.compose.AsyncImagePainter
 import coil.compose.SubcomposeAsyncImage
 import coil.compose.SubcomposeAsyncImageContent
@@ -40,6 +42,7 @@ import io.element.android.compound.theme.ElementTheme
 import io.element.android.libraries.designsystem.colors.AvatarColorsProvider
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
+import io.element.android.libraries.designsystem.preview.debugPlaceholderAvatar
 import io.element.android.libraries.designsystem.text.toSp
 import io.element.android.libraries.designsystem.theme.components.Text
 import timber.log.Timber
@@ -73,21 +76,32 @@ private fun ImageAvatar(
     modifier: Modifier = Modifier,
     contentDescription: String? = null,
 ) {
-    SubcomposeAsyncImage(
-        model = avatarData,
-        contentDescription = contentDescription,
-        contentScale = ContentScale.Crop,
-        modifier = modifier
-    ) {
-        when (val state = painter.state) {
-            is AsyncImagePainter.State.Success -> SubcomposeAsyncImageContent()
-            is AsyncImagePainter.State.Error -> {
-                SideEffect {
-                    Timber.e(state.result.throwable, "Error loading avatar $state\n${state.result}")
+    if (LocalInspectionMode.current) {
+        // For compose previews, use debugPlaceholderAvatar()
+        // instead of falling back to initials avatar on load failure
+        AsyncImage(
+            model = avatarData,
+            contentDescription = contentDescription,
+            placeholder = debugPlaceholderAvatar(),
+            modifier = modifier
+        )
+    } else {
+        SubcomposeAsyncImage(
+            model = avatarData,
+            contentDescription = contentDescription,
+            contentScale = ContentScale.Crop,
+            modifier = modifier
+        ) {
+            when (val state = painter.state) {
+                is AsyncImagePainter.State.Success -> SubcomposeAsyncImageContent()
+                is AsyncImagePainter.State.Error -> {
+                    SideEffect {
+                        Timber.e(state.result.throwable, "Error loading avatar $state\n${state.result}")
+                    }
+                    InitialsAvatar(avatarData = avatarData)
                 }
-                InitialsAvatar(avatarData = avatarData)
+                else -> InitialsAvatar(avatarData = avatarData)
             }
-            else -> InitialsAvatar(avatarData = avatarData)
         }
     }
 }