Migrate other icons to compound icons.

features/analytics/impl/src/main/kotlin/io/element/android/features/analytics/impl/AnalyticsOptInView.kt

@@ -30,7 +30,6 @@ import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.text.ClickableText
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Poll
-import androidx.compose.material.icons.rounded.Check
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
@@ -56,6 +55,7 @@ import io.element.android.libraries.designsystem.theme.components.ButtonSize
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.TextButton
 import io.element.android.libraries.designsystem.theme.temporaryColorBgSpecial
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.designsystem.utils.LogCompositions
 import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
@@ -147,7 +147,7 @@ private fun CheckIcon(modifier: Modifier = Modifier) {
             .size(20.dp)
             .background(color = MaterialTheme.colorScheme.background, shape = CircleShape)
             .padding(2.dp),
-        imageVector = Icons.Rounded.Check,
+        resourceId = CommonDrawables.ic_compound_check,
         contentDescription = null,
         tint = ElementTheme.colors.textActionAccent,
     )

features/call/src/main/kotlin/io/element/android/features/call/CallScreenView.kt

@@ -24,8 +24,6 @@ import android.webkit.WebView
 import androidx.compose.foundation.layout.consumeWindowInsets
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.padding
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Close
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
@@ -37,6 +35,7 @@ import io.element.android.libraries.designsystem.preview.DayNightPreviews
 import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.TopAppBar
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 
 typealias RequestPermissionCallback = (Array<String>) -> Unit
@@ -58,7 +57,7 @@ internal fun CallScreenView(
                     title = { Text(stringResource(R.string.element_call)) },
                     navigationIcon = {
                         BackButton(
-                            imageVector = Icons.Default.Close,
+                            resourceId = CommonDrawables.ic_compound_close,
                             onClick = onClose
                         )
                     }

features/createroom/impl/src/main/kotlin/io/element/android/features/createroom/impl/components/RoomPrivacyOption.kt

@@ -57,7 +57,7 @@ fun RoomPrivacyOption(
     ) {
         Icon(
             modifier = Modifier.padding(horizontal = 8.dp),
-            imageVector = roomPrivacyItem.icon,
+            resourceId = roomPrivacyItem.icon,
             contentDescription = "",
             tint = MaterialTheme.colorScheme.secondary,
         )

features/createroom/impl/src/main/kotlin/io/element/android/features/createroom/impl/configureroom/RoomPrivacyItem.kt

@@ -16,19 +16,17 @@
 
 package io.element.android.features.createroom.impl.configureroom
 
-import androidx.compose.material.icons.Icons
+import androidx.annotation.DrawableRes
-import androidx.compose.material.icons.outlined.Lock
-import androidx.compose.material.icons.outlined.Public
 import androidx.compose.runtime.Composable
-import androidx.compose.ui.graphics.vector.ImageVector
 import androidx.compose.ui.res.stringResource
 import io.element.android.features.createroom.impl.R
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import kotlinx.collections.immutable.ImmutableList
 import kotlinx.collections.immutable.toImmutableList
 
 data class RoomPrivacyItem(
     val privacy: RoomPrivacy,
-    val icon: ImageVector,
+    @DrawableRes val icon: Int,
     val title: String,
     val description: String,
 )
@@ -40,13 +38,13 @@ fun roomPrivacyItems(): ImmutableList<RoomPrivacyItem> {
             when (it) {
                 RoomPrivacy.Private -> RoomPrivacyItem(
                     privacy = it,
-                    icon = Icons.Outlined.Lock,
+                    icon = CommonDrawables.ic_compound_lock,
                     title = stringResource(R.string.screen_create_room_private_option_title),
                     description = stringResource(R.string.screen_create_room_private_option_description),
                 )
                 RoomPrivacy.Public -> RoomPrivacyItem(
                     privacy = it,
-                    icon = Icons.Outlined.Public,
+                    icon = CommonDrawables.ic_compound_public,
                     title = stringResource(R.string.screen_create_room_public_option_title),
                     description = stringResource(R.string.screen_create_room_public_option_description),
                 )

features/createroom/impl/src/main/kotlin/io/element/android/features/createroom/impl/root/CreateRoomRootView.kt

@@ -27,8 +27,6 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Close
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
@@ -42,12 +40,12 @@ import io.element.android.features.createroom.impl.R
 import io.element.android.features.createroom.impl.components.UserListView
 import io.element.android.libraries.architecture.Async
 import io.element.android.libraries.designsystem.components.ProgressDialog
+import io.element.android.libraries.designsystem.components.button.BackButton
 import io.element.android.libraries.designsystem.components.dialogs.RetryDialog
 import io.element.android.libraries.designsystem.preview.DayNightPreviews
 import io.element.android.libraries.designsystem.preview.ElementPreview
 import io.element.android.libraries.designsystem.theme.aliasScreenTitle
 import io.element.android.libraries.designsystem.theme.components.Icon
-import io.element.android.libraries.designsystem.theme.components.IconButton
 import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.TopAppBar
@@ -141,13 +139,10 @@ fun CreateRoomRootViewTopBar(
             )
         },
         navigationIcon = {
-            IconButton(onClick = onClosePressed) {
+            BackButton(
-                Icon(
+                resourceId = CommonDrawables.ic_compound_close,
-                    imageVector = Icons.Default.Close,
+                onClick = onClosePressed,
-                    contentDescription = stringResource(id = CommonStrings.action_close),
+            )
-                    tint = MaterialTheme.colorScheme.primary,
-                )
-            }
         }
     )
 }

features/ftue/impl/src/main/kotlin/io/element/android/features/ftue/impl/notifications/NotificationsOptInView.kt

@@ -29,8 +29,6 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.systemBarsPadding
 import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Notifications
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -50,6 +48,7 @@ import io.element.android.libraries.designsystem.preview.ElementPreview
 import io.element.android.libraries.designsystem.theme.components.Button
 import io.element.android.libraries.designsystem.theme.components.Surface
 import io.element.android.libraries.designsystem.theme.components.TextButton
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 
@@ -80,7 +79,7 @@ private fun NotificationsOptInHeader(
         modifier = modifier,
         title = stringResource(R.string.screen_notification_optin_title),
         subTitle = stringResource(R.string.screen_notification_optin_subtitle),
-        iconImageVector = Icons.Default.Notifications,
+        iconResourceId = CommonDrawables.ic_compound_notifications_solid,
     )
 }
 

features/location/impl/src/main/kotlin/io/element/android/features/location/impl/show/ShowLocationView.kt

@@ -25,7 +25,6 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.LocationSearching
 import androidx.compose.material.icons.filled.MyLocation
-import androidx.compose.material.icons.outlined.Share
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
@@ -51,6 +50,7 @@ import io.element.android.libraries.designsystem.theme.components.IconButton
 import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.TopAppBar
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.maplibre.compose.CameraMode
 import io.element.android.libraries.maplibre.compose.CameraMoveStartedReason
 import io.element.android.libraries.maplibre.compose.IconAnchor
@@ -125,7 +125,10 @@ fun ShowLocationView(
                 },
                 actions = {
                     IconButton(onClick = { state.eventSink(ShowLocationEvents.Share) }) {
-                        Icon(imageVector = Icons.Outlined.Share, contentDescription = stringResource(CommonStrings.action_share))
+                        Icon(
+                            resourceId = CommonDrawables.ic_compound_share_android,
+                            contentDescription = stringResource(CommonStrings.action_share),
+                        )
                     }
                 }
             )

features/login/impl/src/main/kotlin/io/element/android/features/login/impl/accountprovider/AccountProviderView.kt

@@ -23,8 +23,6 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.heightIn
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Search
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
@@ -40,6 +38,7 @@ import io.element.android.libraries.designsystem.preview.ElementPreview
 import io.element.android.libraries.designsystem.theme.components.HorizontalDivider
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 
 /**
@@ -75,7 +74,7 @@ fun AccountProviderView(
                 } else {
                     RoundedIconAtom(
                         size = RoundedIconAtomSize.Medium,
-                        imageVector = Icons.Filled.Search,
+                        resourceId = CommonDrawables.ic_compound_search,
                         tint = MaterialTheme.colorScheme.primary,
                     )
                 }

features/login/impl/src/main/kotlin/io/element/android/features/login/impl/screens/loginpassword/LoginPasswordView.kt

@@ -31,9 +31,6 @@ import androidx.compose.foundation.text.KeyboardOptions
 import androidx.compose.foundation.verticalScroll
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.AccountCircle
-import androidx.compose.material.icons.filled.Close
-import androidx.compose.material.icons.filled.Visibility
-import androidx.compose.material.icons.filled.VisibilityOff
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.derivedStateOf
@@ -72,6 +69,7 @@ import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.TopAppBar
 import io.element.android.libraries.designsystem.theme.components.autofill
 import io.element.android.libraries.designsystem.theme.components.onTabOrEnterKeyFocusNext
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.testtags.TestTags
 import io.element.android.libraries.testtags.testTag
 import io.element.android.libraries.theme.ElementTheme
@@ -220,7 +218,7 @@ internal fun LoginForm(
                     IconButton(onClick = {
                         loginFieldState = ""
                     }) {
-                        Icon(imageVector = Icons.Filled.Close, contentDescription = stringResource(CommonStrings.action_clear))
+                        Icon(resourceId = CommonDrawables.ic_compound_close, contentDescription = stringResource(CommonStrings.action_clear))
                     }
                 }
             } else null,
@@ -253,12 +251,12 @@ internal fun LoginForm(
             visualTransformation = if (passwordVisible) VisualTransformation.None else PasswordVisualTransformation(),
             trailingIcon = {
                 val image =
-                    if (passwordVisible) Icons.Filled.Visibility else Icons.Filled.VisibilityOff
+                    if (passwordVisible) CommonDrawables.ic_compound_visibility_on else CommonDrawables.ic_compound_visibility_off
                 val description =
                     if (passwordVisible) stringResource(CommonStrings.a11y_hide_password) else stringResource(CommonStrings.a11y_show_password)
 
                 IconButton(onClick = { passwordVisible = !passwordVisible }) {
-                    Icon(imageVector = image, description)
+                    Icon(resourceId = image, description)
                 }
             },
             keyboardOptions = KeyboardOptions(

features/login/impl/src/main/kotlin/io/element/android/features/login/impl/screens/searchaccountprovider/SearchAccountProviderView.kt

@@ -32,9 +32,6 @@ import androidx.compose.foundation.lazy.items
 import androidx.compose.foundation.lazy.rememberLazyListState
 import androidx.compose.foundation.text.KeyboardActions
 import androidx.compose.foundation.text.KeyboardOptions
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Close
-import androidx.compose.material.icons.filled.Search
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Scaffold
@@ -69,6 +66,7 @@ import io.element.android.libraries.designsystem.theme.components.IconButton
 import io.element.android.libraries.designsystem.theme.components.OutlinedTextField
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.onTabOrEnterKeyFocusNext
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.testtags.TestTags
 import io.element.android.libraries.testtags.testTag
 import io.element.android.libraries.ui.strings.CommonStrings
@@ -105,7 +103,7 @@ fun SearchAccountProviderView(
                 item {
                     IconTitleSubtitleMolecule(
                         modifier = Modifier.padding(top = 16.dp, bottom = 40.dp, start = 16.dp, end = 16.dp),
-                        iconImageVector = Icons.Filled.Search,
+                        iconResourceId = CommonDrawables.ic_compound_search,
                         title = stringResource(id = R.string.screen_account_provider_form_title),
                         subTitle = stringResource(id = R.string.screen_account_provider_form_subtitle),
                     )
@@ -141,7 +139,7 @@ fun SearchAccountProviderView(
                                     eventSink(SearchAccountProviderEvents.UserInput(""))
                                 }) {
                                     Icon(
-                                        imageVector = Icons.Filled.Close,
+                                        resourceId = CommonDrawables.ic_compound_close,
                                         contentDescription = stringResource(CommonStrings.action_clear)
                                     )
                                 }

features/logout/api/src/main/kotlin/io/element/android/features/logout/api/LogoutPreferenceScreen.kt

@@ -16,8 +16,6 @@
 
 package io.element.android.features.logout.api
 
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Logout
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.mutableStateOf
@@ -29,6 +27,7 @@ import io.element.android.libraries.designsystem.components.dialogs.Confirmation
 import io.element.android.libraries.designsystem.components.preferences.PreferenceText
 import io.element.android.libraries.designsystem.preview.DayNightPreviews
 import io.element.android.libraries.designsystem.preview.ElementPreview
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 
 @Composable
 fun LogoutPreferenceView(
@@ -80,7 +79,7 @@ fun LogoutPreferenceContent(
 ) {
     PreferenceText(
         title = stringResource(id = R.string.screen_signout_preference_item),
-        icon = Icons.Filled.Logout,
+        iconResourceId = CommonDrawables.ic_compound_leave,
         onClick = onClick
     )
 }

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/actionlist/ActionListView.kt

@@ -36,8 +36,6 @@ import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.ExperimentalMaterialApi
 import androidx.compose.material.ListItem
 import androidx.compose.material.Text
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.outlined.AddReaction
 import androidx.compose.material.ripple.rememberRipple
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.MaterialTheme
@@ -78,6 +76,7 @@ import io.element.android.libraries.designsystem.theme.components.HorizontalDivi
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.ModalBottomSheet
 import io.element.android.libraries.designsystem.theme.components.hide
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.matrix.ui.components.AttachmentThumbnail
 import io.element.android.libraries.matrix.ui.components.AttachmentThumbnailInfo
 import io.element.android.libraries.matrix.ui.components.AttachmentThumbnailType
@@ -361,7 +360,7 @@ internal fun EmojiReactionsRow(
             contentAlignment = Alignment.Center
         ) {
             Icon(
-                imageVector = Icons.Outlined.AddReaction,
+                resourceId = CommonDrawables.ic_september_add_reaction,
                 contentDescription = "Emojis",
                 tint = MaterialTheme.colorScheme.secondary,
                 modifier = Modifier

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/media/viewer/MediaViewerView.kt

@@ -29,9 +29,7 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Download
 import androidx.compose.material.icons.filled.OpenInNew
-import androidx.compose.material.icons.filled.Share
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.LinearProgressIndicator
 import androidx.compose.runtime.Composable
@@ -61,6 +59,7 @@ import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.IconButton
 import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.TopAppBar
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.designsystem.utils.SnackbarHost
 import io.element.android.libraries.designsystem.utils.rememberSnackbarHostState
 import io.element.android.libraries.matrix.api.media.MediaSource
@@ -176,7 +175,10 @@ private fun MediaViewerTopBar(
                     eventSink(MediaViewerEvents.OpenWith)
                 },
             ) {
-                Icon(imageVector = Icons.Default.OpenInNew, contentDescription = stringResource(id = CommonStrings.action_open_with))
+                Icon(
+                    imageVector = Icons.Default.OpenInNew,
+                    contentDescription = stringResource(id = CommonStrings.action_open_with)
+                )
             }
             IconButton(
                 enabled = actionsEnabled,
@@ -184,7 +186,10 @@ private fun MediaViewerTopBar(
                     eventSink(MediaViewerEvents.SaveOnDisk)
                 },
             ) {
-                Icon(imageVector = Icons.Default.Download, contentDescription = stringResource(id = CommonStrings.action_save))
+                Icon(
+                    resourceId = CommonDrawables.ic_compound_download,
+                    contentDescription = stringResource(id = CommonStrings.action_save),
+                )
             }
             IconButton(
                 enabled = actionsEnabled,
@@ -192,7 +197,10 @@ private fun MediaViewerTopBar(
                     eventSink(MediaViewerEvents.Share)
                 },
             ) {
-                Icon(imageVector = Icons.Default.Share, contentDescription = stringResource(id = CommonStrings.action_share))
+                Icon(
+                    resourceId = CommonDrawables.ic_compound_share_android,
+                    contentDescription = stringResource(id = CommonStrings.action_share)
+                )
             }
         }
     )

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/TimelineView.kt

@@ -36,8 +36,6 @@ import androidx.compose.foundation.lazy.LazyListState
 import androidx.compose.foundation.lazy.items
 import androidx.compose.foundation.lazy.rememberLazyListState
 import androidx.compose.foundation.shape.CircleShape
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.ArrowDownward
 import androidx.compose.material3.FloatingActionButtonDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
@@ -49,6 +47,7 @@ import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.runtime.saveable.rememberSaveable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.rotate
 import androidx.compose.ui.platform.LocalInspectionMode
 import androidx.compose.ui.res.pluralStringResource
 import androidx.compose.ui.tooling.preview.PreviewParameter
@@ -68,6 +67,7 @@ import io.element.android.libraries.designsystem.preview.DayNightPreviews
 import io.element.android.libraries.designsystem.preview.ElementPreview
 import io.element.android.libraries.designsystem.theme.components.FloatingActionButton
 import io.element.android.libraries.designsystem.theme.components.Icon
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.matrix.api.core.EventId
 import io.element.android.libraries.matrix.api.core.UserId
 import io.element.android.libraries.theme.ElementTheme
@@ -315,8 +315,8 @@ private fun JumpToBottomButton(
             contentColor = ElementTheme.colors.iconSecondary
         ) {
             Icon(
-                modifier = Modifier.size(24.dp),
+                modifier = Modifier.size(24.dp).rotate(90f),
-                imageVector = Icons.Filled.ArrowDownward,
+                resourceId = CommonDrawables.ic_compound_arrow_right,
                 contentDescription = "",
             )
         }

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/event/TimelineItemFileView.kt

@@ -24,8 +24,6 @@ import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.shape.CircleShape
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.outlined.Attachment
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -41,6 +39,7 @@ import io.element.android.libraries.designsystem.preview.DayNightPreviews
 import io.element.android.libraries.designsystem.preview.ElementPreview
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 
 @Composable
@@ -60,7 +59,7 @@ fun TimelineItemFileView(
             contentAlignment = Alignment.Center,
         ) {
             Icon(
-                imageVector = Icons.Outlined.Attachment,
+                resourceId = CommonDrawables.ic_september_attachment,
                 contentDescription = "OpenFile",
                 tint = ElementTheme.materialColors.primary,
                 modifier = Modifier

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/components/group/GroupHeaderView.kt

@@ -24,14 +24,12 @@ import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.ExpandLess
-import androidx.compose.material.icons.filled.ExpandMore
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
+import androidx.compose.ui.draw.rotate
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.unit.dp
 import io.element.android.libraries.designsystem.preview.DayNightPreviews
@@ -39,6 +37,7 @@ import io.element.android.libraries.designsystem.preview.ElementPreview
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Surface
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 
 private val CORNER_RADIUS = 8.dp
@@ -77,12 +76,12 @@ fun GroupHeaderView(
                     color = MaterialTheme.colorScheme.secondary,
                     style = ElementTheme.typography.fontBodyMdRegular,
                 )
-                val icon = if (isExpanded) {
+                Icon(
-                    Icons.Default.ExpandLess
+                    modifier = Modifier.rotate(if (isExpanded) 180f else 0f),
-                } else {
+                    resourceId = CommonDrawables.ic_compound_chevron_down,
-                    Icons.Default.ExpandMore
+                    contentDescription = null,
-                }
+                    tint = MaterialTheme.colorScheme.secondary
-                Icon(icon, "", tint = MaterialTheme.colorScheme.secondary)
+                )
             }
         }
     }

features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/timeline/debug/EventDebugInfoView.kt

@@ -33,9 +33,6 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.ArrowDropDown
-import androidx.compose.material.icons.filled.ArrowDropUp
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
@@ -46,6 +43,7 @@ import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
+import androidx.compose.ui.draw.rotate
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.platform.LocalInspectionMode
 import androidx.compose.ui.text.font.FontFamily
@@ -59,6 +57,7 @@ import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.TopAppBar
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.matrix.api.core.EventId
 import io.element.android.libraries.theme.ElementTheme
 
@@ -140,7 +139,8 @@ private fun CollapsibleSection(
         ) {
             Text(title, modifier = Modifier.weight(1f))
             Icon(
-                imageVector = if (isExpanded) Icons.Filled.ArrowDropUp else Icons.Filled.ArrowDropDown,
+                modifier = Modifier.rotate(if (isExpanded) 180f else 0f),
+                resourceId = CommonDrawables.ic_compound_chevron_down,
                 contentDescription = null
             )
         }

features/networkmonitor/api/src/main/kotlin/io/element/android/features/networkmonitor/api/ui/ConnectivityIndicatorView.kt

@@ -25,7 +25,6 @@ import androidx.compose.animation.expandVertically
 import androidx.compose.animation.fadeIn
 import androidx.compose.animation.fadeOut
 import androidx.compose.animation.shrinkVertically
-import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Row
@@ -38,15 +37,12 @@ import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.statusBars
 import androidx.compose.foundation.layout.statusBarsPadding
 import androidx.compose.foundation.layout.width
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.outlined.WifiOff
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.ColorFilter
 import androidx.compose.ui.platform.LocalInspectionMode
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.unit.Dp
@@ -55,7 +51,9 @@ import androidx.compose.ui.unit.sp
 import io.element.android.libraries.designsystem.preview.DayNightPreviews
 import io.element.android.libraries.designsystem.preview.ElementPreview
 import io.element.android.libraries.designsystem.text.toDp
+import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 
@@ -144,10 +142,10 @@ private fun Indicator(modifier: Modifier = Modifier) {
         verticalAlignment = Alignment.CenterVertically,
     ) {
         val tint = MaterialTheme.colorScheme.primary
-        Image(
+        Icon(
-            imageVector = Icons.Outlined.WifiOff,
+            resourceId = CommonDrawables.ic_compound_offline,
             contentDescription = null,
-            colorFilter = ColorFilter.tint(tint),
+            tint = tint,
             modifier = Modifier.size(16.sp.toDp()),
         )
         Spacer(modifier = Modifier.width(8.dp))

features/onboarding/impl/src/main/kotlin/io/element/android/features/onboarding/impl/OnBoardingView.kt

@@ -25,7 +25,6 @@ import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.QrCode
-import androidx.compose.material.icons.filled.Settings
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Alignment.Companion.CenterHorizontally
@@ -48,6 +47,7 @@ import io.element.android.libraries.designsystem.theme.components.IconButton
 import io.element.android.libraries.designsystem.theme.components.IconSource
 import io.element.android.libraries.designsystem.theme.components.OutlinedButton
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.testtags.TestTags
 import io.element.android.libraries.testtags.testTag
 import io.element.android.libraries.theme.ElementTheme
@@ -140,7 +140,7 @@ private fun OnBoardingContent(
                 onClick = onOpenDeveloperSettings,
             ) {
                 Icon(
-                    imageVector = Icons.Filled.Settings,
+                    resourceId = CommonDrawables.ic_compound_settings_solid,
                     contentDescription = stringResource(CommonStrings.common_settings)
                 )
             }

features/preferences/impl/src/main/kotlin/io/element/android/features/preferences/impl/developer/tracing/ConfigureTracingView.kt

@@ -28,11 +28,6 @@ import androidx.compose.foundation.layout.systemBarsPadding
 import androidx.compose.foundation.layout.widthIn
 import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.verticalScroll
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.ArrowDropDown
-import androidx.compose.material.icons.filled.ArrowDropUp
-import androidx.compose.material.icons.filled.MoreVert
-import androidx.compose.material.icons.outlined.Delete
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
@@ -40,6 +35,7 @@ import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.rotate
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
@@ -56,6 +52,7 @@ import io.element.android.libraries.designsystem.theme.components.ListItem
 import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.TopAppBar
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.matrix.api.tracing.LogLevel
 import io.element.android.libraries.matrix.api.tracing.Target
 import io.element.android.libraries.theme.ElementTheme
@@ -93,7 +90,7 @@ fun ConfigureTracingView(
                         onClick = { showMenu = !showMenu }
                     ) {
                         Icon(
-                            imageVector = Icons.Default.MoreVert,
+                            resourceId = CommonDrawables.ic_compound_overflow_vertical,
                             tint = ElementTheme.materialColors.secondary,
                             contentDescription = null,
                         )
@@ -110,7 +107,7 @@ fun ConfigureTracingView(
                             text = { Text("Reset to default") },
                             leadingIcon = {
                                 Icon(
-                                    Icons.Outlined.Delete,
+                                    resourceId = CommonDrawables.ic_compound_delete,
                                     tint = ElementTheme.materialColors.secondary,
                                     contentDescription = null,
                                 )
@@ -212,11 +209,11 @@ fun LogLevelDropdownMenu(
             text = { Text(text = logLevel.filter) },
             onClick = { expanded = !expanded },
             trailingIcon = {
-                if (expanded) {
+                Icon(
-                    Icon(Icons.Default.ArrowDropUp, contentDescription = null)
+                    modifier = Modifier.rotate(if (expanded) 180f else 0f),
-                } else {
+                    resourceId = CommonDrawables.ic_compound_chevron_down,
-                    Icon(Icons.Default.ArrowDropDown, contentDescription = null)
+                    contentDescription = null,
-                }
+                )
             },
         )
         DropdownMenu(

features/preferences/impl/src/main/kotlin/io/element/android/features/preferences/impl/notifications/NotificationSettingsView.kt

@@ -23,8 +23,6 @@ import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.NotificationsOff
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
@@ -47,6 +45,7 @@ import io.element.android.libraries.designsystem.theme.components.Button
 import io.element.android.libraries.designsystem.theme.components.ButtonSize
 import io.element.android.libraries.designsystem.theme.components.Surface
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.designsystem.utils.OnLifecycleEvent
 import io.element.android.libraries.matrix.api.room.RoomNotificationMode
 import io.element.android.libraries.theme.ElementTheme
@@ -108,7 +107,7 @@ private fun NotificationSettingsContentView(
     val context = LocalContext.current
     if (systemSettings.appNotificationsEnabled && !systemSettings.systemNotificationsEnabled) {
         PreferenceText(
-            icon = Icons.Filled.NotificationsOff,
+            iconResourceId = CommonDrawables.ic_compound_notifications_solid_off,
             title = stringResource(id = CommonStrings.screen_notification_settings_system_notifications_turned_off),
             subtitle = stringResource(
                 id = CommonStrings.screen_notification_settings_system_notifications_action_required,

features/preferences/impl/src/main/kotlin/io/element/android/features/preferences/impl/root/PreferencesRootView.kt

@@ -20,13 +20,7 @@ import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.outlined.BugReport
-import androidx.compose.material.icons.outlined.DeveloperMode
-import androidx.compose.material.icons.outlined.Help
 import androidx.compose.material.icons.outlined.InsertChart
-import androidx.compose.material.icons.outlined.Notifications
-import androidx.compose.material.icons.outlined.OpenInNew
-import androidx.compose.material.icons.outlined.Settings
 import androidx.compose.material.icons.outlined.VerifiedUser
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
@@ -43,6 +37,7 @@ import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.preview.LargeHeightPreview
 import io.element.android.libraries.designsystem.theme.components.HorizontalDivider
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.designsystem.utils.SnackbarHost
 import io.element.android.libraries.designsystem.utils.rememberSnackbarHostState
 import io.element.android.libraries.matrix.api.user.MatrixUser
@@ -92,7 +87,7 @@ fun PreferencesRootView(
         if (state.accountManagementUrl != null) {
             PreferenceText(
                 title = stringResource(id = CommonStrings.action_manage_account),
-                icon = Icons.Outlined.OpenInNew,
+                iconResourceId = CommonDrawables.ic_compound_pop_out,
                 onClick = { onManageAccountClicked(state.accountManagementUrl) },
             )
             HorizontalDivider()
@@ -107,32 +102,32 @@ fun PreferencesRootView(
         if (state.showNotificationSettings) {
             PreferenceText(
                 title = stringResource(id = CommonStrings.screen_notification_settings_title),
-                icon = Icons.Outlined.Notifications,
+                iconResourceId = CommonDrawables.ic_compound_notifications,
                 onClick = onOpenNotificationSettings,
             )
         }
         PreferenceText(
             title = stringResource(id = CommonStrings.action_report_bug),
-            icon = Icons.Outlined.BugReport,
+            iconResourceId = CommonDrawables.ic_compound_chat_problem,
             onClick = onOpenRageShake
         )
         PreferenceText(
             title = stringResource(id = CommonStrings.common_about),
-            icon = Icons.Outlined.Help,
+            iconResourceId = CommonDrawables.ic_compound_info,
             onClick = onOpenAbout,
         )
         HorizontalDivider()
         if (state.devicesManagementUrl != null) {
             PreferenceText(
                 title = stringResource(id = CommonStrings.action_manage_devices),
-                icon = Icons.Outlined.OpenInNew,
+                iconResourceId = CommonDrawables.ic_compound_pop_out,
                 onClick = { onManageAccountClicked(state.devicesManagementUrl) },
             )
             HorizontalDivider()
         }
         PreferenceText(
             title = stringResource(id = CommonStrings.common_advanced_settings),
-            icon = Icons.Outlined.Settings,
+            iconResourceId = CommonDrawables.ic_compound_settings,
             onClick = onOpenAdvancedSettings,
         )
         if (state.showDeveloperSettings) {
@@ -159,7 +154,7 @@ fun PreferencesRootView(
 fun DeveloperPreferencesView(onOpenDeveloperSettings: () -> Unit) {
     PreferenceText(
         title = stringResource(id = CommonStrings.common_developer_options),
-        icon = Icons.Outlined.DeveloperMode,
+        iconResourceId = CommonDrawables.ic_developer_mode,
         onClick = onOpenDeveloperSettings
     )
 }

features/roomdetails/impl/src/main/kotlin/io/element/android/features/roomdetails/impl/RoomDetailsView.kt

@@ -33,12 +33,7 @@ import androidx.compose.foundation.verticalScroll
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.MoreVert
 import androidx.compose.material.icons.outlined.Add
-import androidx.compose.material.icons.outlined.Lock
-import androidx.compose.material.icons.outlined.Notifications
-import androidx.compose.material.icons.outlined.NotificationsOff
 import androidx.compose.material.icons.outlined.Person
-import androidx.compose.material.icons.outlined.PersonAddAlt
-import androidx.compose.material.icons.outlined.Share
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
@@ -48,9 +43,7 @@ import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.vector.ImageVector
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.res.vectorResource
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
@@ -77,6 +70,7 @@ import io.element.android.libraries.designsystem.theme.components.IconButton
 import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.TopAppBar
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.matrix.api.room.RoomMember
 import io.element.android.libraries.matrix.api.room.RoomNotificationMode
 import io.element.android.libraries.theme.ElementTheme
@@ -153,7 +147,8 @@ fun RoomDetailsView(
             if (state.canShowNotificationSettings && state.roomNotificationSettings != null) {
                 NotificationSection(
                     isDefaultMode = state.roomNotificationSettings.isDefault,
-                    openRoomNotificationSettings = openRoomNotificationSettings)
+                    openRoomNotificationSettings = openRoomNotificationSettings
+                )
             }
 
             if (state.roomType is RoomDetailsType.Room) {
@@ -230,17 +225,29 @@ internal fun MainActionsSection(state: RoomDetailsState, onShareRoom: () -> Unit
         val roomNotificationSettings = state.roomNotificationSettings
         if (state.canShowNotificationSettings && roomNotificationSettings != null) {
             if (roomNotificationSettings.mode == RoomNotificationMode.MUTE) {
-                MainActionButton(title = stringResource(CommonStrings.common_unmute), icon = Icons.Outlined.NotificationsOff, onClick = {
+                MainActionButton(
-                    state.eventSink(RoomDetailsEvent.UnmuteNotification)
+                    title = stringResource(CommonStrings.common_unmute),
-                })
+                    iconResourceId = CommonDrawables.ic_compound_notifications_off,
+                    onClick = {
+                        state.eventSink(RoomDetailsEvent.UnmuteNotification)
+                    },
+                )
             } else {
-                MainActionButton(title = stringResource(CommonStrings.common_mute), icon = Icons.Outlined.Notifications, onClick = {
+                MainActionButton(
-                    state.eventSink(RoomDetailsEvent.MuteNotification)
+                    title = stringResource(CommonStrings.common_mute),
-                })
+                    iconResourceId = CommonDrawables.ic_compound_notifications,
+                    onClick = {
+                        state.eventSink(RoomDetailsEvent.MuteNotification)
+                    },
+                )
             }
         }
         Spacer(modifier = Modifier.width(20.dp))
-        MainActionButton(title = stringResource(R.string.screen_room_details_share_room_title), icon = Icons.Outlined.Share, onClick = onShareRoom)
+        MainActionButton(
+            title = stringResource(R.string.screen_room_details_share_room_title),
+            iconResourceId = CommonDrawables.ic_compound_share_android,
+            onClick = onShareRoom
+        )
     }
 }
 
@@ -322,7 +329,7 @@ internal fun NotificationSection(
         PreferenceText(
             title = stringResource(R.string.screen_room_details_notification_title),
             subtitle = subtitle,
-            icon = Icons.Outlined.Notifications,
+            iconResourceId = CommonDrawables.ic_compound_notifications,
             onClick = openRoomNotificationSettings,
         )
     }
@@ -352,7 +359,7 @@ internal fun InviteSection(
     PreferenceCategory(modifier = modifier) {
         PreferenceText(
             title = stringResource(R.string.screen_room_details_invite_people_title),
-            icon = Icons.Outlined.PersonAddAlt,
+            iconResourceId = CommonDrawables.ic_compound_user_add,
             onClick = invitePeople,
         )
     }
@@ -364,7 +371,7 @@ internal fun SecuritySection(modifier: Modifier = Modifier) {
         PreferenceText(
             title = stringResource(R.string.screen_room_details_encryption_enabled_title),
             subtitle = stringResource(R.string.screen_room_details_encryption_enabled_subtitle),
-            icon = Icons.Outlined.Lock,
+            iconResourceId = CommonDrawables.ic_compound_lock,
         )
     }
 }
@@ -374,7 +381,7 @@ internal fun OtherActionsSection(onLeaveRoom: () -> Unit, modifier: Modifier = M
     PreferenceCategory(showDivider = false, modifier = modifier) {
         PreferenceText(
             title = stringResource(R.string.screen_room_details_leave_room_title),
-            icon = ImageVector.vectorResource(R.drawable.ic_door_open),
+            iconResourceId = CommonDrawables.ic_compound_leave,
             tintColor = MaterialTheme.colorScheme.error,
             onClick = onLeaveRoom,
         )

features/roomdetails/impl/src/main/kotlin/io/element/android/features/roomdetails/impl/members/details/RoomMemberDetailsView.kt

@@ -32,7 +32,6 @@ import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.verticalScroll
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.outlined.ChatBubbleOutline
-import androidx.compose.material.icons.outlined.Share
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
@@ -57,6 +56,7 @@ import io.element.android.libraries.designsystem.preview.LargeHeightPreview
 import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.TopAppBar
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 
@@ -126,7 +126,9 @@ internal fun RoomMemberHeaderSection(
             text = userId,
             style = ElementTheme.typography.fontBodyLgRegular,
             color = MaterialTheme.colorScheme.secondary,
-            modifier = Modifier.fillMaxWidth().padding(horizontal = 16.dp),
+            modifier = Modifier
+                .fillMaxWidth()
+                .padding(horizontal = 16.dp),
             textAlign = TextAlign.Center,
         )
         Spacer(Modifier.height(40.dp))
@@ -136,7 +138,11 @@ internal fun RoomMemberHeaderSection(
 @Composable
 internal fun RoomMemberMainActionsSection(onShareUser: () -> Unit, modifier: Modifier = Modifier) {
     Row(modifier.fillMaxWidth(), horizontalArrangement = Arrangement.Center) {
-        MainActionButton(title = stringResource(CommonStrings.action_share), icon = Icons.Outlined.Share, onClick = onShareUser)
+        MainActionButton(
+            title = stringResource(CommonStrings.action_share),
+            iconResourceId = CommonDrawables.ic_compound_share_android,
+            onClick = onShareUser
+        )
     }
 }
 

features/roomlist/impl/src/main/kotlin/io/element/android/features/roomlist/impl/RoomListContextMenu.kt

@@ -22,8 +22,6 @@ import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.size
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.outlined.Settings
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.ListItem
 import androidx.compose.material3.MaterialTheme
@@ -92,7 +90,7 @@ private fun RoomListModalBottomSheetContent(
             modifier = Modifier.clickable { onRoomSettingsClicked(contextMenu.roomId) },
             leadingContent = {
                 Icon(
-                    imageVector = Icons.Outlined.Settings,
+                    resourceId = CommonDrawables.ic_compound_settings,
                     contentDescription = stringResource(id = CommonStrings.common_settings),
                     modifier = Modifier.size(20.dp),
                     tint = MaterialTheme.colorScheme.onSurface,
@@ -110,7 +108,7 @@ private fun RoomListModalBottomSheetContent(
             modifier = Modifier.clickable { onLeaveRoomClicked(contextMenu.roomId) },
             leadingContent = {
                 Icon(
-                    resourceId = CommonDrawables.ic_door_open_24,
+                    resourceId = CommonDrawables.ic_compound_leave,
                     contentDescription = stringResource(id = CommonStrings.action_leave_room),
                     modifier = Modifier.size(20.dp),
                     tint = MaterialTheme.colorScheme.error,

features/roomlist/impl/src/main/kotlin/io/element/android/features/roomlist/impl/components/RequestVerificationHeader.kt

@@ -24,8 +24,6 @@ import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Close
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
@@ -40,6 +38,7 @@ import io.element.android.libraries.designsystem.theme.components.ButtonSize
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Surface
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 
@@ -70,7 +69,7 @@ internal fun RequestVerificationHeader(
                     )
                     Icon(
                         modifier = Modifier.clickable(onClick = onDismissClicked),
-                        imageVector = Icons.Default.Close,
+                        resourceId = CommonDrawables.ic_compound_close,
                         contentDescription = stringResource(CommonStrings.action_close)
                     )
                 }

features/roomlist/impl/src/main/kotlin/io/element/android/features/roomlist/impl/components/RoomListTopBar.kt

@@ -22,9 +22,6 @@ import androidx.compose.foundation.layout.WindowInsets
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.statusBars
 import androidx.compose.foundation.layout.statusBarsPadding
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.outlined.BugReport
-import androidx.compose.material.icons.outlined.Share
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.material3.TopAppBarScrollBehavior
@@ -66,6 +63,7 @@ import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.IconButton
 import io.element.android.libraries.designsystem.theme.components.MediumTopAppBar
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.designsystem.utils.LogCompositions
 import io.element.android.libraries.matrix.api.core.UserId
 import io.element.android.libraries.matrix.api.user.MatrixUser
@@ -233,7 +231,7 @@ private fun DefaultRoomListTopBar(
                         text = { Text(stringResource(id = CommonStrings.action_invite)) },
                         leadingIcon = {
                             Icon(
-                                Icons.Outlined.Share,
+                                resourceId = CommonDrawables.ic_compound_share_android,
                                 tint = ElementTheme.materialColors.secondary,
                                 contentDescription = null,
                             )
@@ -247,7 +245,7 @@ private fun DefaultRoomListTopBar(
                         text = { Text(stringResource(id = CommonStrings.common_report_a_bug)) },
                         leadingIcon = {
                             Icon(
-                                Icons.Outlined.BugReport,
+                                resourceId = CommonDrawables.ic_compound_chat_problem,
                                 tint = ElementTheme.materialColors.secondary,
                                 contentDescription = null,
                             )

features/roomlist/impl/src/main/kotlin/io/element/android/features/roomlist/impl/search/RoomListSearch.kt

@@ -27,8 +27,6 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.items
 import androidx.compose.foundation.lazy.rememberLazyListState
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Close
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.TextFieldDefaults
@@ -65,6 +63,7 @@ import io.element.android.libraries.designsystem.theme.components.IconButton
 import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.TextField
 import io.element.android.libraries.designsystem.theme.components.TopAppBar
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.designsystem.utils.copy
 import io.element.android.libraries.matrix.api.core.RoomId
 import io.element.android.libraries.ui.strings.CommonStrings
@@ -154,7 +153,7 @@ internal fun RoomListSearchResultContent(
                                     state.eventSink(RoomListEvents.UpdateFilter(""))
                                 }) {
                                     Icon(
-                                        imageVector = Icons.Default.Close,
+                                        resourceId = CommonDrawables.ic_compound_close,
                                         contentDescription = stringResource(CommonStrings.action_cancel)
                                     )
                                 }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/atoms/InfoListItemMolecule.kt

@@ -24,8 +24,6 @@ import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Info
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Modifier
@@ -35,6 +33,7 @@ import io.element.android.libraries.designsystem.preview.DayNightPreviews
 import io.element.android.libraries.designsystem.preview.ElementPreview
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 
 @Composable
 fun InfoListItemMolecule(
@@ -79,25 +78,25 @@ internal fun InfoListItemMoleculePreview() {
         ) {
             InfoListItemMolecule(
                 message = { Text("A single item") },
-                icon = { Icon(imageVector = Icons.Default.Info, contentDescription = null) },
+                icon = { Icon(resourceId = CommonDrawables.ic_compound_info, contentDescription = null) },
                 position = InfoListItemPosition.Single,
                 backgroundColor = color,
             )
             InfoListItemMolecule(
                 message = { Text("A top item") },
-                icon = { Icon(imageVector = Icons.Default.Info, contentDescription = null) },
+                icon = { Icon(resourceId = CommonDrawables.ic_compound_info, contentDescription = null) },
                 position = InfoListItemPosition.Top,
                 backgroundColor = color,
             )
             InfoListItemMolecule(
                 message = { Text("A middle item") },
-                icon = { Icon(imageVector = Icons.Default.Info, contentDescription = null) },
+                icon = { Icon(resourceId = CommonDrawables.ic_compound_info, contentDescription = null) },
                 position = InfoListItemPosition.Middle,
                 backgroundColor = color,
             )
             InfoListItemMolecule(
                 message = { Text("A bottom item") },
-                icon = { Icon(imageVector = Icons.Default.Info, contentDescription = null) },
+                icon = { Icon(resourceId = CommonDrawables.ic_compound_info, contentDescription = null) },
                 position = InfoListItemPosition.Bottom,
                 backgroundColor = color,
             )

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/Bloom.kt

@@ -33,8 +33,6 @@ import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.verticalScroll
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Share
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.TopAppBarDefaults
@@ -114,6 +112,7 @@ import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.MediumTopAppBar
 import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 import kotlinx.collections.immutable.ImmutableList
 import kotlinx.collections.immutable.persistentListOf
@@ -375,7 +374,7 @@ fun Modifier.avatarBloom(
             width = avatarData.size.dp,
             height = avatarData.size.dp,
             text = avatarData.initial,
-            textColor =  avatarColors.foreground,
+            textColor = avatarColors.foreground,
             backgroundColor = avatarColors.background,
         )
         val hash = remember(avatarData, avatarColors) {
@@ -430,7 +429,7 @@ private fun initialsBitmap(
         val bitmap = Bitmap.createBitmap(width.roundToPx(), height.roundToPx(), Bitmap.Config.ARGB_8888).asImageBitmap()
         androidx.compose.ui.graphics.Canvas(bitmap).also { canvas ->
             canvas.drawCircle(centerPx.toOffset(), width.toPx() / 2, backgroundPaint)
-            canvas.nativeCanvas.drawText(text, centerPx.x.toFloat() - result.size.width/2, centerPx.y * 2f - result.size.height/2 - 4, textPaint)
+            canvas.nativeCanvas.drawText(text, centerPx.x.toFloat() - result.size.width / 2, centerPx.y * 2f - result.size.height / 2 - 4, textPaint)
         }
         bitmap
     }
@@ -467,7 +466,9 @@ internal fun BloomPreview() {
     val scrollBehavior = TopAppBarDefaults.exitUntilCollapsedScrollBehavior(topAppBarState)
     ElementPreview {
         Scaffold(
-            modifier = Modifier.fillMaxSize().nestedScroll(scrollBehavior.nestedScrollConnection),
+            modifier = Modifier
+                .fillMaxSize()
+                .nestedScroll(scrollBehavior.nestedScrollConnection),
             topBar = {
                 Box {
                     MediumTopAppBar(
@@ -499,7 +500,10 @@ internal fun BloomPreview() {
                         },
                         actions = {
                             IconButton(onClick = {}) {
-                                Icon(imageVector = Icons.Default.Share, contentDescription = null)
+                                Icon(
+                                    resourceId = CommonDrawables.ic_compound_share_android,
+                                    contentDescription = null,
+                                )
                             }
                         },
                         title = {
@@ -539,7 +543,8 @@ internal fun BloomInitialsPreview(@PreviewParameter(InitialsColorStateProvider::
         val bitmap = initialsBitmap(text = "F", backgroundColor = avatarColors.background, textColor = avatarColors.foreground)
         val hash = BlurHash.encode(bitmap.asAndroidBitmap(), BloomDefaults.HASH_COMPONENTS, BloomDefaults.HASH_COMPONENTS)
         Box(
-            modifier = Modifier.size(256.dp)
+            modifier = Modifier
+                .size(256.dp)
                 .bloom(
                     hash = hash,
                     background = if (ElementTheme.isLightTheme) {

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/button/BackButton.kt

@@ -16,25 +16,25 @@
 
 package io.element.android.libraries.designsystem.components.button
 
+import androidx.annotation.DrawableRes
 import androidx.compose.foundation.layout.Column
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.ArrowBack
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.vector.ImageVector
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.Preview
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.IconButton
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.ui.strings.CommonStrings
 
 @Composable
 fun BackButton(
     onClick: () -> Unit,
     modifier: Modifier = Modifier,
-    imageVector: ImageVector = Icons.Default.ArrowBack,
+    // TODO Handle RTL languages
+    @DrawableRes resourceId: Int = CommonDrawables.ic_compound_arrow_left,
     contentDescription: String = stringResource(CommonStrings.action_back),
     enabled: Boolean = true,
 ) {
@@ -43,7 +43,7 @@ fun BackButton(
         onClick = onClick,
         enabled = enabled,
     ) {
-        Icon(imageVector = imageVector, contentDescription = contentDescription)
+        Icon(resourceId = resourceId, contentDescription = contentDescription)
     }
 }
 

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/button/MainActionButton.kt

@@ -16,6 +16,7 @@
 
 package io.element.android.libraries.designsystem.components.button
 
+import androidx.annotation.DrawableRes
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.Column
@@ -24,8 +25,6 @@ import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.width
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.outlined.Share
 import androidx.compose.material.ripple.rememberRipple
 import androidx.compose.material3.LocalContentColor
 import androidx.compose.material3.MaterialTheme
@@ -33,19 +32,19 @@ import androidx.compose.runtime.Composable
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.vector.ImageVector
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 
 @Composable
 fun MainActionButton(
     title: String,
-    icon: ImageVector,
+    @DrawableRes iconResourceId: Int,
     onClick: () -> Unit,
     modifier: Modifier = Modifier,
     enabled: Boolean = true,
@@ -64,7 +63,7 @@ fun MainActionButton(
     ) {
         val tintColor = if (enabled) LocalContentColor.current else MaterialTheme.colorScheme.secondary
         Icon(
-            icon,
+            resourceId = iconResourceId,
             contentDescription = contentDescription,
             tint = tintColor,
         )
@@ -88,8 +87,17 @@ internal fun MainActionButtonPreview() {
 @Composable
 private fun ContentsToPreview() {
     Row(Modifier.padding(10.dp)) {
-        MainActionButton(title = "Share", icon = Icons.Outlined.Share, onClick = { })
+        MainActionButton(
+            title = "Share",
+            iconResourceId = CommonDrawables.ic_compound_share_android,
+            onClick = { },
+        )
         Spacer(modifier = Modifier.width(20.dp))
-        MainActionButton(title = "Share", icon = Icons.Outlined.Share, onClick = { }, enabled = false)
+        MainActionButton(
+            title = "Share",
+            iconResourceId = CommonDrawables.ic_compound_share_android,
+            onClick = { },
+            enabled = false,
+        )
     }
 }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/preferences/PreferenceCategory.kt

@@ -20,9 +20,6 @@ import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.ColumnScope
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Announcement
-import androidx.compose.material.icons.filled.BugReport
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.tooling.preview.Preview
@@ -30,6 +27,7 @@ import androidx.compose.ui.unit.dp
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 
 @Composable
@@ -79,11 +77,11 @@ private fun ContentToPreview() {
     ) {
         PreferenceText(
             title = "Title",
-            icon = Icons.Default.BugReport,
+            iconResourceId = CommonDrawables.ic_compound_chat_problem,
         )
         PreferenceSwitch(
             title = "Switch",
-            icon = Icons.Default.Announcement,
+            iconResourceId = CommonDrawables.ic_compound_threads,
             isChecked = true
         )
         PreferenceSlide(

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/preferences/PreferenceCheckbox.kt

@@ -16,6 +16,7 @@
 
 package io.element.android.libraries.designsystem.components.preferences
 
+import androidx.annotation.DrawableRes
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
@@ -23,8 +24,6 @@ import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.defaultMinSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Announcement
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -38,6 +37,7 @@ import io.element.android.libraries.designsystem.theme.components.Checkbox
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.toEnabledColor
 import io.element.android.libraries.designsystem.toSecondaryEnabledColor
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 
 @Composable
@@ -48,6 +48,7 @@ fun PreferenceCheckbox(
     supportingText: String? = null,
     enabled: Boolean = true,
     icon: ImageVector? = null,
+    @DrawableRes iconResourceId: Int? = null,
     showIconAreaIfNoIcon: Boolean = false,
     onCheckedChange: (Boolean) -> Unit = {},
 ) {
@@ -61,6 +62,7 @@ fun PreferenceCheckbox(
     ) {
         PreferenceIcon(
             icon = icon,
+            iconResourceId = iconResourceId,
             enabled = enabled,
             isVisible = showIconAreaIfNoIcon
         )
@@ -100,14 +102,14 @@ private fun ContentToPreview() {
     Column {
         PreferenceCheckbox(
             title = "Checkbox",
-            icon = Icons.Default.Announcement,
+            iconResourceId = CommonDrawables.ic_compound_threads,
             enabled = true,
             isChecked = true
         )
         PreferenceCheckbox(
             title = "Checkbox with supporting text",
             supportingText = "Supporting text",
-            icon = Icons.Default.Announcement,
+            iconResourceId = CommonDrawables.ic_compound_threads,
             enabled = true,
             isChecked = true
         )

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/preferences/PreferenceScreen.kt

@@ -28,9 +28,6 @@ import androidx.compose.foundation.layout.statusBars
 import androidx.compose.foundation.layout.systemBarsPadding
 import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.verticalScroll
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Announcement
-import androidx.compose.material.icons.filled.BugReport
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
@@ -42,6 +39,7 @@ import io.element.android.libraries.designsystem.theme.aliasScreenTitle
 import io.element.android.libraries.designsystem.theme.components.Scaffold
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.theme.components.TopAppBar
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 
 @OptIn(ExperimentalLayoutApi::class)
@@ -115,18 +113,18 @@ internal fun PreferenceViewPreview() = ElementPreview {
             PreferenceText(
                 title = "Title",
                 subtitle = "Some other text",
-                icon = Icons.Default.BugReport,
+                iconResourceId = CommonDrawables.ic_compound_chat_problem,
             )
             PreferenceDivider()
             PreferenceSwitch(
                 title = "Switch",
-                icon = Icons.Default.Announcement,
+                iconResourceId = CommonDrawables.ic_compound_threads,
                 isChecked = true,
             )
             PreferenceDivider()
             PreferenceCheckbox(
                 title = "Checkbox",
-                icon = Icons.Default.Announcement,
+                iconResourceId = CommonDrawables.ic_compound_notifications,
                 isChecked = true,
             )
             PreferenceDivider()

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/preferences/PreferenceSlide.kt

@@ -16,14 +16,13 @@
 
 package io.element.android.libraries.designsystem.components.preferences
 
+import androidx.annotation.DrawableRes
 import androidx.annotation.FloatRange
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.defaultMinSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Person
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.vector.ImageVector
@@ -35,6 +34,7 @@ import io.element.android.libraries.designsystem.preview.PreviewGroup
 import io.element.android.libraries.designsystem.theme.components.Slider
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.toEnabledColor
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 
 @Composable
@@ -44,6 +44,7 @@ fun PreferenceSlide(
     value: Float,
     modifier: Modifier = Modifier,
     icon: ImageVector? = null,
+    @DrawableRes iconResourceId: Int? = null,
     showIconAreaIfNoIcon: Boolean = false,
     enabled: Boolean = true,
     summary: String? = null,
@@ -56,7 +57,11 @@ fun PreferenceSlide(
             .defaultMinSize(minHeight = preferenceMinHeight)
             .padding(vertical = 4.dp, horizontal = preferencePaddingHorizontal),
     ) {
-        PreferenceIcon(icon = icon, isVisible = showIconAreaIfNoIcon)
+        PreferenceIcon(
+            icon = icon,
+            iconResourceId = iconResourceId,
+            isVisible = showIconAreaIfNoIcon,
+        )
         Column(
             modifier = Modifier
                 .weight(1f),
@@ -90,7 +95,7 @@ internal fun PreferenceSlidePreview() = ElementThemedPreview { ContentToPreview(
 @Composable
 private fun ContentToPreview() {
     PreferenceSlide(
-        icon = Icons.Default.Person,
+        iconResourceId = CommonDrawables.ic_compound_user_profile,
         title = "Slide",
         summary = "Summary",
         value = 0.75F

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/preferences/PreferenceSwitch.kt

@@ -16,6 +16,7 @@
 
 package io.element.android.libraries.designsystem.components.preferences
 
+import androidx.annotation.DrawableRes
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
@@ -25,8 +26,6 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.width
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Announcement
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -40,6 +39,7 @@ import io.element.android.libraries.designsystem.theme.components.Switch
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.toEnabledColor
 import io.element.android.libraries.designsystem.toSecondaryEnabledColor
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 
 @Composable
@@ -50,6 +50,7 @@ fun PreferenceSwitch(
     subtitle: String? = null,
     enabled: Boolean = true,
     icon: ImageVector? = null,
+    @DrawableRes iconResourceId: Int? = null,
     showIconAreaIfNoIcon: Boolean = false,
     onCheckedChange: (Boolean) -> Unit = {},
     switchAlignment: Alignment.Vertical = Alignment.CenterVertically
@@ -64,6 +65,7 @@ fun PreferenceSwitch(
     ) {
         PreferenceIcon(
             icon = icon,
+            iconResourceId = iconResourceId,
             enabled = enabled,
             isVisible = showIconAreaIfNoIcon
         )
@@ -107,7 +109,7 @@ private fun ContentToPreview() {
     PreferenceSwitch(
         title = "Switch",
         subtitle = "Subtitle Switch",
-        icon = Icons.Default.Announcement,
+        iconResourceId = CommonDrawables.ic_compound_threads,
         enabled = true,
         isChecked = true
     )

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/preferences/PreferenceText.kt

@@ -16,6 +16,7 @@
 
 package io.element.android.libraries.designsystem.components.preferences
 
+import androidx.annotation.DrawableRes
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
@@ -25,8 +26,6 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.progressSemantics
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.BugReport
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -41,6 +40,7 @@ import io.element.android.libraries.designsystem.theme.components.CircularProgre
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.toEnabledColor
 import io.element.android.libraries.designsystem.toSecondaryEnabledColor
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 
 /**
@@ -55,6 +55,7 @@ fun PreferenceText(
     currentValue: String? = null,
     loadingCurrentValue: Boolean = false,
     icon: ImageVector? = null,
+    @DrawableRes iconResourceId: Int? = null,
     showIconAreaIfNoIcon: Boolean = false,
     tintColor: Color? = null,
     onClick: () -> Unit = {},
@@ -71,6 +72,7 @@ fun PreferenceText(
     ) {
         PreferenceIcon(
             icon = icon,
+            iconResourceId = iconResourceId,
             enabled = enabled,
             isVisible = showIconAreaIfNoIcon,
             tintColor = tintColor ?: enabled.toSecondaryEnabledColor(),
@@ -126,40 +128,40 @@ private fun ContentToPreview() {
     ) {
         PreferenceText(
             title = "Title",
-            icon = Icons.Default.BugReport,
+            iconResourceId = CommonDrawables.ic_compound_chat_problem,
         )
         PreferenceText(
             title = "Title",
             subtitle = "Some content",
-            icon = Icons.Default.BugReport,
+            iconResourceId = CommonDrawables.ic_compound_chat_problem,
         )
         PreferenceText(
             title = "Title",
             subtitle = "Some content",
-            icon = Icons.Default.BugReport,
+            iconResourceId = CommonDrawables.ic_compound_chat_problem,
             currentValue = "123",
         )
         PreferenceText(
             title = "Title",
             subtitle = "Some content",
-            icon = Icons.Default.BugReport,
+            iconResourceId = CommonDrawables.ic_compound_chat_problem,
             currentValue = "123",
             enabled = false,
         )
         PreferenceText(
             title = "Title",
             subtitle = "Some content",
-            icon = Icons.Default.BugReport,
+            iconResourceId = CommonDrawables.ic_compound_chat_problem,
             loadingCurrentValue = true,
         )
         PreferenceText(
             title = "Title",
-            icon = Icons.Default.BugReport,
+            iconResourceId = CommonDrawables.ic_compound_chat_problem,
             currentValue = "123",
         )
         PreferenceText(
             title = "Title",
-            icon = Icons.Default.BugReport,
+            iconResourceId = CommonDrawables.ic_compound_chat_problem,
             loadingCurrentValue = true,
         )
         PreferenceText(

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/preferences/components/PreferenceIcon.kt

@@ -16,6 +16,7 @@
 
 package io.element.android.libraries.designsystem.components.preferences.components
 
+import androidx.annotation.DrawableRes
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
@@ -34,15 +35,17 @@ import io.element.android.libraries.designsystem.toSecondaryEnabledColor
 
 @Composable
 fun PreferenceIcon(
-    icon: ImageVector?,
     modifier: Modifier = Modifier,
+    icon: ImageVector? = null,
+    @DrawableRes iconResourceId: Int? = null,
     tintColor: Color? = null,
     enabled: Boolean = true,
     isVisible: Boolean = true,
 ) {
-    if (icon != null) {
+    if (icon != null || iconResourceId != null) {
         Icon(
             imageVector = icon,
+            resourceId = iconResourceId,
             contentDescription = "",
             tint = tintColor ?: enabled.toSecondaryEnabledColor(),
             modifier = modifier
@@ -61,5 +64,5 @@ internal fun PreferenceIconPreview(@PreviewParameter(ImageVectorProvider::class)
 
 @Composable
 private fun ContentToPreview(content: ImageVector?) {
-    PreferenceIcon(content)
+    PreferenceIcon(icon = content)
 }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/AlertDialogContent.kt

@@ -24,8 +24,6 @@ import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.sizeIn
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Notifications
 import androidx.compose.material3.LocalContentColor
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.ProvideTextStyle
@@ -44,6 +42,7 @@ import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 import kotlin.math.max
 
@@ -417,7 +416,10 @@ internal fun DialogWithTitleIconAndOkButtonPreview() {
         DialogPreview {
             SimpleAlertDialogContent(
                 icon = {
-                    Icon(imageVector = Icons.Default.Notifications, contentDescription = null)
+                    Icon(
+                        resourceId = CommonDrawables.ic_compound_notifications_solid,
+                        contentDescription = null
+                    )
                 },
                 title = "Dialog Title",
                 content = "A dialog is a type of modal window that appears in front of app content to provide critical information, or prompt for a decision to be made. Learn more",

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/Button.kt

@@ -31,8 +31,6 @@ import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.progressSemantics
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.outlined.Share
 import androidx.compose.material3.ButtonColors
 import androidx.compose.material3.ButtonDefaults
 import androidx.compose.material3.LocalContentColor
@@ -53,6 +51,7 @@ import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 
 // Designs: https://www.figma.com/file/G1xy0HDZKJf5TCRFmKb5d5/Compound-Android-Components?type=design&mode=design&t=U03tOFZz5FSLVUMa-1
@@ -346,7 +345,7 @@ private fun ButtonCombinationPreview(
             // With icon
             ButtonRowPreview(
                 modifier = Modifier.then(modifier),
-                leadingIcon = IconSource.Vector(Icons.Outlined.Share),
+                leadingIcon = IconSource.Resource(CommonDrawables.ic_compound_share_android),
                 style = style,
                 size = size,
             )

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/DropdownMenuItem.kt

@@ -19,9 +19,6 @@ package io.element.android.libraries.designsystem.theme.components
 import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.PaddingValues
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.ArrowRight
-import androidx.compose.material.icons.filled.BugReport
 import androidx.compose.material3.LocalTextStyle
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.MenuDefaults
@@ -33,6 +30,7 @@ import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 
 // Figma designs: https://www.figma.com/file/G1xy0HDZKJf5TCRFmKb5d5/Compound-Android-Components?type=design&node-id=1032%3A44063&mode=design&t=rsNegTbEVLYAXL76-1
@@ -88,32 +86,32 @@ private fun ContentToPreview() {
         DropdownMenuItem(
             text = { Text(text = "Item") },
             onClick = {},
-            trailingIcon = { Icon(Icons.Default.ArrowRight, contentDescription = null) },
+            trailingIcon = { Icon(resourceId = CommonDrawables.ic_compound_chevron_right, contentDescription = null) },
         )
         HorizontalDivider()
         DropdownMenuItem(
             text = { Text(text = "Item") },
             onClick = {},
-            leadingIcon = { Icon(Icons.Default.BugReport, contentDescription = null) },
+            leadingIcon = { Icon(resourceId = CommonDrawables.ic_compound_chat_problem, contentDescription = null) },
         )
         DropdownMenuItem(
             text = { Text(text = "Item") },
             onClick = {},
-            leadingIcon = { Icon(Icons.Default.BugReport, contentDescription = null) },
+            leadingIcon = { Icon(resourceId = CommonDrawables.ic_compound_chat_problem, contentDescription = null) },
-            trailingIcon = { Icon(Icons.Default.ArrowRight, contentDescription = null) },
+            trailingIcon = { Icon(resourceId = CommonDrawables.ic_compound_chevron_right, contentDescription = null) },
         )
         DropdownMenuItem(
             text = { Text(text = "Item") },
             onClick = {},
             enabled = false,
-            leadingIcon = { Icon(Icons.Default.BugReport, contentDescription = null) },
+            leadingIcon = { Icon(resourceId = CommonDrawables.ic_compound_chat_problem, contentDescription = null) },
-            trailingIcon = { Icon(Icons.Default.ArrowRight, contentDescription = null) },
+            trailingIcon = { Icon(resourceId = CommonDrawables.ic_compound_chevron_right, contentDescription = null) },
         )
         HorizontalDivider()
         DropdownMenuItem(
             text = { Text(text = "Multiline\nItem") },
             onClick = {},
-            trailingIcon = { Icon(Icons.Default.ArrowRight, contentDescription = null) },
+            trailingIcon = { Icon(resourceId = CommonDrawables.ic_compound_chevron_right, contentDescription = null) },
         )
     }
 }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/FloatingActionButton.kt

@@ -20,8 +20,6 @@ import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.shape.CircleShape
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Close
 import androidx.compose.material3.FloatingActionButtonDefaults
 import androidx.compose.material3.FloatingActionButtonElevation
 import androidx.compose.material3.contentColorFor
@@ -34,6 +32,7 @@ import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 
 @Composable
 fun FloatingActionButton(
@@ -67,7 +66,7 @@ internal fun FloatingActionButtonPreview() =
 private fun ContentToPreview() {
     Box(modifier = Modifier.padding(8.dp)) {
         FloatingActionButton(onClick = {}) {
-            Icon(imageVector = Icons.Filled.Close, contentDescription = "")
+            Icon(resourceId = CommonDrawables.ic_compound_close, contentDescription = "")
         }
     }
 }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/Icon.kt

@@ -17,8 +17,6 @@
 package io.element.android.libraries.designsystem.theme.components
 
 import androidx.annotation.DrawableRes
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Close
 import androidx.compose.material3.LocalContentColor
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
@@ -30,6 +28,7 @@ import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.tooling.preview.Preview
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 
 /**
  * Icon is a wrapper around [androidx.compose.material3.Icon] which allows to use
@@ -146,5 +145,5 @@ internal fun IconImageVectorPreview() =
 
 @Composable
 private fun ContentToPreview() {
-    Icon(imageVector = Icons.Filled.Close, contentDescription = "")
+    Icon(resourceId = CommonDrawables.ic_compound_close, contentDescription = "")
 }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/IconButton.kt

@@ -19,8 +19,6 @@ package io.element.android.libraries.designsystem.theme.components
 import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Close
 import androidx.compose.material3.IconButtonDefaults
 import androidx.compose.material3.LocalContentColor
 import androidx.compose.runtime.Composable
@@ -30,6 +28,7 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.tooling.preview.Preview
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 
 // Figma designs: https://www.figma.com/file/G1xy0HDZKJf5TCRFmKb5d5/Compound-Android-Components?type=design&node-id=1182%3A48861&mode=design&t=Shlcvznm1oUyqGC2-1
@@ -67,20 +66,20 @@ private fun ContentToPreview() {
         CompositionLocalProvider(LocalContentColor provides ElementTheme.colors.iconPrimary) {
             Row {
                 IconButton(onClick = {}) {
-                    Icon(imageVector = Icons.Filled.Close, contentDescription = "")
+                    Icon(resourceId = CommonDrawables.ic_compound_close, contentDescription = "")
                 }
                 IconButton(enabled = false, onClick = {}) {
-                    Icon(imageVector = Icons.Filled.Close, contentDescription = "")
+                    Icon(resourceId = CommonDrawables.ic_compound_close, contentDescription = "")
                 }
             }
         }
         CompositionLocalProvider(LocalContentColor provides ElementTheme.colors.iconSecondary) {
             Row {
                 IconButton(onClick = {}) {
-                    Icon(imageVector = Icons.Filled.Close, contentDescription = "")
+                    Icon(resourceId = CommonDrawables.ic_compound_close, contentDescription = "")
                 }
                 IconButton(enabled = false, onClick = {}) {
-                    Icon(imageVector = Icons.Filled.Close, contentDescription = "")
+                    Icon(resourceId = CommonDrawables.ic_compound_close, contentDescription = "")
                 }
             }
         }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/ListItem.kt

@@ -17,8 +17,6 @@
 package io.element.android.libraries.designsystem.theme.components
 
 import androidx.compose.foundation.clickable
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.outlined.Share
 import androidx.compose.material3.ListItemColors
 import androidx.compose.material3.ListItemDefaults
 import androidx.compose.material3.LocalContentColor
@@ -37,6 +35,7 @@ import androidx.compose.ui.unit.dp
 import io.element.android.libraries.designsystem.components.list.ListItemContent
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 
 // Designs: https://www.figma.com/file/G1xy0HDZKJf5TCRFmKb5d5/Compound-Android-Components?type=design&node-id=425%3A24208&mode=design&t=G5hCfkLB6GgXDuWe-1
@@ -119,7 +118,9 @@ fun ListItem(
 
     androidx.compose.material3.ListItem(
         headlineContent = decoratedHeadlineContent,
-        modifier = if (onClick != null) Modifier.clickable(enabled = enabled, onClick = onClick).then(modifier) else modifier,
+        modifier = if (onClick != null) Modifier
+            .clickable(enabled = enabled, onClick = onClick)
+            .then(modifier) else modifier,
         overlineContent = null,
         supportingContent = decoratedSupportingContent,
         leadingContent = decoratedLeadingContent,
@@ -135,27 +136,31 @@ fun ListItem(
  */
 sealed interface ListItemStyle {
     data object Default : ListItemStyle
-    data object Primary: ListItemStyle
+    data object Primary : ListItemStyle
     data object Destructive : ListItemStyle
 
-    @Composable fun headlineColor() = when (this) {
+    @Composable
+    fun headlineColor() = when (this) {
         Default, Primary -> ListItemDefaultColors.headline
         Destructive -> ElementTheme.colors.textCriticalPrimary
     }
 
-    @Composable fun supportingTextColor() = when (this) {
+    @Composable
+    fun supportingTextColor() = when (this) {
         Default, Primary -> ListItemDefaultColors.supportingText
         // FIXME once we have a defined color for this value
         Destructive -> ElementTheme.colors.textCriticalPrimary.copy(alpha = 0.8f)
     }
 
-    @Composable fun leadingIconColor() = when (this) {
+    @Composable
+    fun leadingIconColor() = when (this) {
         Default -> ListItemDefaultColors.icon
         Primary -> ElementTheme.colors.iconPrimary
         Destructive -> ElementTheme.colors.iconCriticalPrimary
     }
 
-    @Composable fun trailingIconColor() = when (this) {
+    @Composable
+    fun trailingIconColor() = when (this) {
         Default -> ListItemDefaultColors.icon
         Primary -> ElementTheme.colors.iconPrimary
         Destructive -> ElementTheme.colors.iconCriticalPrimary
@@ -169,15 +174,16 @@ object ListItemDefaultColors {
     val icon: Color @Composable get() = ElementTheme.colors.iconTertiary
     val iconDisabled: Color @Composable get() = ElementTheme.colors.iconDisabled
 
-    val colors: ListItemColors @Composable get() = ListItemDefaults.colors(
+    val colors: ListItemColors
-        headlineColor = headline,
+        @Composable get() = ListItemDefaults.colors(
-        supportingColor = supportingText,
+            headlineColor = headline,
-        leadingIconColor = icon,
+            supportingColor = supportingText,
-        trailingIconColor = icon,
+            leadingIconColor = icon,
-        disabledHeadlineColor = headlineDisabled,
+            trailingIconColor = icon,
-        disabledLeadingIconColor = iconDisabled,
+            disabledHeadlineColor = headlineDisabled,
-        disabledTrailingIconColor = iconDisabled,
+            disabledLeadingIconColor = iconDisabled,
-    )
+            disabledTrailingIconColor = iconDisabled,
+        )
 }
 
 // region: Simple list item
@@ -191,7 +197,7 @@ internal fun ListItemTwoLinesSimplePreview() = PreviewItems.TwoLinesListItemPrev
 
 @Preview(name = "List item (1 line) - Simple", group = PreviewGroup.ListItems)
 @Composable
-internal fun ListItemSingleLineSimplePreview()  = PreviewItems.OneLineListItemPreview()
+internal fun ListItemSingleLineSimplePreview() = PreviewItems.OneLineListItemPreview()
 // endregion
 
 // region: Trailing Checkbox
@@ -453,10 +459,12 @@ private object PreviewItems {
     }
 
     @Composable
-    fun switch() : ListItemContent {
+    fun switch(): ListItemContent {
         var checked by remember { mutableStateOf(false) }
         return ListItemContent.Switch(checked = checked, onChange = { checked = !checked })
     }
 
-    fun icon() = ListItemContent.Icon(iconSource = IconSource.Vector(Icons.Outlined.Share))
+    fun icon() = ListItemContent.Icon(
+        iconSource = IconSource.Resource(CommonDrawables.ic_compound_share_android)
+    )
 }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/ListSection.kt

@@ -21,8 +21,6 @@ import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.outlined.Share
 import androidx.compose.material3.LocalContentColor
 import androidx.compose.material3.LocalTextStyle
 import androidx.compose.runtime.Composable
@@ -37,6 +35,7 @@ import io.element.android.libraries.designsystem.components.ClickableLinkText
 import io.element.android.libraries.designsystem.components.list.ListItemContent
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 
 // Designs: https://www.figma.com/file/G1xy0HDZKJf5TCRFmKb5d5/Compound-Android-Components?type=design&node-id=425%3A24208&mode=design&t=G5hCfkLB6GgXDuWe-1
@@ -128,12 +127,16 @@ object ListSupportingTextDefaults {
     sealed interface Padding {
         /** No padding. */
         data object None : Padding
+
         /** Default padding, it will align fine with a [ListItem] with no leading content. */
         data object Default : Padding
+
         /** It will align to a [ListItem] with an [Icon] or [Checkbox] as leading content. */
         data object SmallLeadingContent : Padding
+
         /** It will align to with a [ListItem] with a [Switch] as leading content. */
         data object LargeLeadingContent : Padding
+
         /** It will align to with a [ListItem] with a custom start [padding]. */
         data class Custom(val padding: Dp) : Padding
 
@@ -256,7 +259,10 @@ internal fun ListSupportingTextDefaultPaddingPreview() {
 internal fun ListSupportingTextSmallPaddingPreview() {
     ElementThemedPreview {
         Column {
-            ListItem(headlineContent = { Text("A title") }, leadingContent = ListItemContent.Icon(IconSource.Vector(Icons.Outlined.Share)))
+            ListItem(
+                headlineContent = { Text("A title") },
+                leadingContent = ListItemContent.Icon(IconSource.Resource(CommonDrawables.ic_compound_share_android))
+            )
             ListSupportingText(
                 text = "Supporting line text lorem ipsum dolor sit amet, consectetur. Read more",
                 contentPadding = ListSupportingTextDefaults.Padding.SmallLeadingContent,

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/MediumTopAppBar.kt

@@ -18,8 +18,6 @@ package io.element.android.libraries.designsystem.theme.components
 
 import androidx.compose.foundation.layout.RowScope
 import androidx.compose.foundation.layout.WindowInsets
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Share
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.LocalContentColor
 import androidx.compose.material3.TopAppBarColors
@@ -32,6 +30,7 @@ import androidx.compose.ui.tooling.preview.Preview
 import io.element.android.libraries.designsystem.components.button.BackButton
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 
 @OptIn(ExperimentalMaterial3Api::class)
@@ -74,7 +73,10 @@ private fun ContentToPreview() {
         actions = {
             TextButton(text = "Action", onClick = {})
             IconButton(onClick = {}) {
-                Icon(imageVector = Icons.Default.Share, contentDescription = null)
+                Icon(
+                    resourceId = CommonDrawables.ic_compound_share_android,
+                    contentDescription = null,
+                )
             }
         }
     )

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/SearchBar.kt

@@ -24,9 +24,6 @@ import androidx.compose.foundation.layout.WindowInsets
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Close
-import androidx.compose.material.icons.filled.Search
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.SearchBarColors
@@ -46,6 +43,7 @@ import androidx.compose.ui.unit.dp
 import io.element.android.libraries.designsystem.components.button.BackButton
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
 
@@ -99,7 +97,7 @@ fun <T> SearchBar(
                 {
                     IconButton(onClick = { onQueryChange("") }) {
                         Icon(
-                            imageVector = Icons.Default.Close,
+                            resourceId = CommonDrawables.ic_compound_close,
                             contentDescription = stringResource(CommonStrings.action_clear),
                         )
                     }
@@ -109,7 +107,7 @@ fun <T> SearchBar(
             !active -> {
                 {
                     Icon(
-                        imageVector = Icons.Default.Search,
+                        resourceId = CommonDrawables.ic_compound_search,
                         contentDescription = stringResource(CommonStrings.action_search),
                         tint = MaterialTheme.colorScheme.tertiary,
                     )

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/Snackbar.kt

@@ -17,8 +17,6 @@
 package io.element.android.libraries.designsystem.theme.components
 
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Close
 import androidx.compose.material3.SnackbarDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
@@ -29,6 +27,7 @@ import androidx.compose.ui.unit.dp
 import io.element.android.libraries.designsystem.components.button.ButtonVisuals
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.theme.SnackBarLabelColorDark
 import io.element.android.libraries.theme.SnackBarLabelColorLight
@@ -119,8 +118,10 @@ internal fun SnackbarWithActionAndCloseButtonPreview() {
     ElementThemedPreview {
         Snackbar(
             message = "Snackbar supporting text",
-            action = ButtonVisuals.Text("Action", {}),
+            action = ButtonVisuals.Text("Action") {},
-            dismissAction = ButtonVisuals.Icon(IconSource.Vector(Icons.Default.Close), {})
+            dismissAction = ButtonVisuals.Icon(
+                IconSource.Resource(CommonDrawables.ic_compound_close)
+            ) {}
         )
     }
 }
@@ -140,7 +141,9 @@ internal fun SnackbarWithActionOnNewLineAndCloseButtonPreview() {
         Snackbar(
             message = "Snackbar supporting text",
             action = ButtonVisuals.Text("Action", {}),
-            dismissAction = ButtonVisuals.Icon(IconSource.Vector(Icons.Default.Close), {}),
+            dismissAction = ButtonVisuals.Icon(
+                IconSource.Resource(CommonDrawables.ic_compound_close)
+            ) {},
             actionOnNewLine = true
         )
     }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/TopAppBar.kt

@@ -18,8 +18,6 @@ package io.element.android.libraries.designsystem.theme.components
 
 import androidx.compose.foundation.layout.RowScope
 import androidx.compose.foundation.layout.WindowInsets
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Share
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.LocalContentColor
 import androidx.compose.material3.TopAppBarColors
@@ -32,6 +30,7 @@ import androidx.compose.ui.tooling.preview.Preview
 import io.element.android.libraries.designsystem.components.button.BackButton
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.theme.ElementTheme
 
 @OptIn(ExperimentalMaterial3Api::class)
@@ -74,7 +73,10 @@ private fun ContentToPreview() {
         actions = {
             TextButton(text = "Action", onClick = {})
             IconButton(onClick = {}) {
-                Icon(imageVector = Icons.Default.Share, contentDescription = null)
+                Icon(
+                    resourceId = CommonDrawables.ic_compound_share_android,
+                    contentDescription = null,
+                )
             }
         }
     )

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/previews/MenuPreview.kt

@@ -17,7 +17,6 @@
 package io.element.android.libraries.designsystem.theme.components.previews
 
 import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.ArrowRight
 import androidx.compose.material.icons.filled.Favorite
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
@@ -32,6 +31,7 @@ import io.element.android.libraries.designsystem.theme.components.DropdownMenu
 import io.element.android.libraries.designsystem.theme.components.DropdownMenuItem
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 
 @Preview(group = PreviewGroup.Menus)
 @Composable
@@ -51,7 +51,10 @@ internal fun MenuPreview() {
 
                 val trailingIcon: @Composable (() -> Unit)? = if (i in 3..4) {
                     @Composable {
-                        Icon(Icons.Filled.ArrowRight, contentDescription = "Favorite")
+                        Icon(
+                            resourceId = CommonDrawables.ic_compound_chevron_right,
+                            contentDescription = "Favorite",
+                        )
                     }
                 } else {
                     null

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/utils/Snackbar.kt

@@ -18,8 +18,6 @@ package io.element.android.libraries.designsystem.utils
 
 import androidx.annotation.StringRes
 import androidx.compose.foundation.layout.padding
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Close
 import androidx.compose.material3.SnackbarDuration
 import androidx.compose.material3.SnackbarHostState
 import androidx.compose.runtime.Composable
@@ -88,7 +86,10 @@ fun SnackbarHost(hostState: SnackbarHostState, modifier: Modifier = Modifier) {
             message = data.visuals.message,
             action = data.visuals.actionLabel?.let { ButtonVisuals.Text(it, data::performAction) },
             dismissAction = if (data.visuals.withDismissAction) {
-                ButtonVisuals.Icon(IconSource.Vector(Icons.Default.Close), data::dismiss)
+                ButtonVisuals.Icon(
+                    IconSource.Resource(CommonDrawables.ic_compound_close),
+                    data::dismiss
+                )
             } else null,
         )
     }

libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/AttachmentThumbnail.kt

@@ -21,7 +21,6 @@ import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.outlined.Attachment
 import androidx.compose.material.icons.outlined.GraphicEq
 import androidx.compose.material.icons.outlined.VideoCameraBack
 import androidx.compose.material3.MaterialTheme
@@ -34,6 +33,7 @@ import androidx.compose.ui.layout.ContentScale
 import io.element.android.libraries.designsystem.components.BlurHashAsyncImage
 import io.element.android.libraries.designsystem.components.PinIcon
 import io.element.android.libraries.designsystem.theme.components.Icon
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.matrix.api.media.MediaSource
 import io.element.android.libraries.matrix.ui.media.MediaRequestData
 import kotlinx.parcelize.Parcelize
@@ -77,7 +77,7 @@ fun AttachmentThumbnail(
                 }
                 AttachmentThumbnailType.File -> {
                     Icon(
-                        imageVector = Icons.Outlined.Attachment,
+                        resourceId = CommonDrawables.ic_september_attachment,
                         contentDescription = info.textContent,
                         modifier = Modifier.rotate(-45f)
                     )
@@ -94,7 +94,7 @@ fun AttachmentThumbnail(
 }
 
 @Parcelize
-enum class AttachmentThumbnailType: Parcelable {
+enum class AttachmentThumbnailType : Parcelable {
     Image, Video, File, Audio, Location
 }
 
@@ -104,4 +104,4 @@ data class AttachmentThumbnailInfo(
     val thumbnailSource: MediaSource? = null,
     val textContent: String? = null,
     val blurHash: String? = null,
-): Parcelable
+) : Parcelable

libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/AvatarActionBottomSheet.kt

@@ -100,7 +100,7 @@ private fun AvatarActionBottomSheetContent(
                 },
                 leadingContent = {
                     Icon(
-                        imageVector = action.icon,
+                        resourceId = action.iconResourceId,
                         contentDescription = stringResource(action.titleResId),
                         tint = if (action.destructive) MaterialTheme.colorScheme.error else MaterialTheme.colorScheme.secondary,
                     )

libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/SelectedRoom.kt

@@ -24,8 +24,6 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.shape.CircleShape
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Close
 import androidx.compose.material.ripple.rememberRipple
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
@@ -44,6 +42,7 @@ import io.element.android.libraries.designsystem.preview.ElementPreview
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Surface
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.matrix.api.core.RoomId
 import io.element.android.libraries.matrix.api.roomlist.RoomSummaryDetails
 import io.element.android.libraries.ui.strings.CommonStrings
@@ -82,7 +81,7 @@ fun SelectedRoom(
                 ),
         ) {
             Icon(
-                imageVector = Icons.Default.Close,
+                resourceId = CommonDrawables.ic_compound_close,
                 contentDescription = stringResource(id = CommonStrings.action_remove),
                 tint = MaterialTheme.colorScheme.onPrimary,
                 modifier = Modifier.padding(2.dp)

libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/SelectedUser.kt

@@ -24,8 +24,6 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.shape.CircleShape
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Close
 import androidx.compose.material.ripple.rememberRipple
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
@@ -43,6 +41,7 @@ import io.element.android.libraries.designsystem.preview.ElementPreview
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Surface
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.matrix.api.user.MatrixUser
 import io.element.android.libraries.matrix.ui.model.getAvatarData
 import io.element.android.libraries.matrix.ui.model.getBestName
@@ -82,7 +81,7 @@ fun SelectedUser(
                 ),
         ) {
             Icon(
-                imageVector = Icons.Default.Close,
+                resourceId = CommonDrawables.ic_compound_close,
                 contentDescription = stringResource(id = CommonStrings.action_remove),
                 tint = MaterialTheme.colorScheme.onPrimary,
                 modifier = Modifier.padding(2.dp)

libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/components/UnresolvedUserRow.kt

@@ -24,8 +24,6 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.heightIn
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Error
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
@@ -44,6 +42,7 @@ import io.element.android.libraries.designsystem.theme.components.Checkbox
 import io.element.android.libraries.designsystem.theme.components.HorizontalDivider
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.matrix.ui.model.getAvatarData
 import io.element.android.libraries.theme.ElementTheme
 import io.element.android.libraries.ui.strings.CommonStrings
@@ -83,7 +82,7 @@ fun UnresolvedUserRow(
                     .padding(top = 3.dp)
             ) {
                 Icon(
-                    imageVector = Icons.Filled.Error,
+                    resourceId = CommonDrawables.ic_compound_error,
                     contentDescription = "",
                     modifier = Modifier
                         .size(18.dp)

libraries/matrixui/src/main/kotlin/io/element/android/libraries/matrix/ui/media/AvatarAction.kt

@@ -16,22 +16,31 @@
 
 package io.element.android.libraries.matrix.ui.media
 
+import androidx.annotation.DrawableRes
 import androidx.annotation.StringRes
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.outlined.Delete
-import androidx.compose.material.icons.outlined.PhotoCamera
-import androidx.compose.material.icons.outlined.PhotoLibrary
 import androidx.compose.runtime.Immutable
-import androidx.compose.ui.graphics.vector.ImageVector
+import io.element.android.libraries.designsystem.utils.CommonDrawables
 import io.element.android.libraries.ui.strings.CommonStrings
 
 @Immutable
 sealed class AvatarAction(
     @StringRes val titleResId: Int,
-    val icon: ImageVector,
+    @DrawableRes val iconResourceId: Int,
     val destructive: Boolean = false,
 ) {
-    data object TakePhoto : AvatarAction(titleResId = CommonStrings.action_take_photo, icon = Icons.Outlined.PhotoCamera)
+    data object TakePhoto : AvatarAction(
-    data object ChoosePhoto : AvatarAction(titleResId = CommonStrings.action_choose_photo, icon = Icons.Outlined.PhotoLibrary)
+        titleResId = CommonStrings.action_take_photo,
-    data object Remove : AvatarAction(titleResId = CommonStrings.action_remove, icon = Icons.Outlined.Delete, destructive = true)
+        iconResourceId = CommonDrawables.ic_september_take_photo_camera,
+    )
+
+    data object ChoosePhoto : AvatarAction(
+        titleResId = CommonStrings.action_choose_photo,
+        iconResourceId = CommonDrawables.ic_september_photo_video_library,
+    )
+
+    data object Remove : AvatarAction(
+        titleResId = CommonStrings.action_remove,
+        iconResourceId = CommonDrawables.ic_compound_delete,
+        destructive = true
+    )
 }

libraries/textcomposer/impl/src/main/kotlin/io/element/android/libraries/textcomposer/TextComposer.kt

@@ -38,8 +38,6 @@ import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Close
 import androidx.compose.material.ripple.rememberRipple
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
@@ -494,7 +492,7 @@ private fun EditingModeView(
                 .weight(1f)
         )
         Icon(
-            imageVector = Icons.Default.Close,
+            resourceId = CommonDrawables.ic_compound_close,
             contentDescription = stringResource(CommonStrings.action_close),
             tint = ElementTheme.materialColors.secondary,
             modifier = Modifier
@@ -557,7 +555,7 @@ private fun ReplyToModeView(
             )
         }
         Icon(
-            imageVector = Icons.Default.Close,
+            resourceId = CommonDrawables.ic_compound_close,
             contentDescription = stringResource(CommonStrings.action_close),
             tint = MaterialTheme.colorScheme.secondary,
             modifier = Modifier