Material 3 theme [WIP]

ui/src/main/java/de/mm20/launcher2/ui/AppTheme.kt

@@ -1,34 +1,28 @@
 package de.mm20.launcher2.ui
 
 import androidx.compose.foundation.isSystemInDarkTheme
-import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.*
+import androidx.compose.material.darkColors
+import androidx.compose.material.lightColors
+import androidx.compose.material3.Typography
+import androidx.compose.material3.lightColorScheme
+import androidx.compose.material3.*
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.collectAsState
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.remember
-import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.font.Font
 import androidx.compose.ui.text.font.FontFamily
 import androidx.compose.ui.text.font.FontWeight
-import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
-import de.mm20.launcher2.preferences.Settings
 import de.mm20.launcher2.preferences.Settings.AppearanceSettings.Theme
 import de.mm20.launcher2.preferences.dataStore
 import de.mm20.launcher2.ui.locals.LocalColorScheme
+import de.mm20.launcher2.ui.theme.colors.toDarkColorScheme
+import de.mm20.launcher2.ui.theme.colors.toLightColorScheme
 import kotlinx.coroutines.flow.map
 
-val lightPalette = lightColors(
-    primary = Color(0, 114, 255)
-)
-
-val darkPalette = darkColors(
-    primary = Color(0, 114, 255)
-)
-
 val Inter = FontFamily(
     Font(R.font.inter_thin, FontWeight.Thin),
     Font(R.font.inter_extralight, FontWeight.ExtraLight),
@@ -43,193 +37,80 @@ val Inter = FontFamily(
 
 
 val typography = Typography(
-    h1 = TextStyle(
-        fontSize = 96.sp,
-        fontWeight = FontWeight.Light,
-        fontFamily = Inter
-    ),
-    h2 = TextStyle(
-        fontSize = 60.sp,
-        fontWeight = FontWeight.Light,
-        fontFamily = Inter
-    ),
-    h3 = TextStyle(
-        fontSize = 48.sp,
-        fontWeight = FontWeight.Normal,
-        fontFamily = Inter
-    ),
-    h4 = TextStyle(
-        fontSize = 34.sp,
-        fontWeight = FontWeight.Normal,
-        fontFamily = Inter
-    ),
-    h5 = TextStyle(
-        fontSize = 24.sp,
-        fontWeight = FontWeight.Medium,
-        fontFamily = Inter
-    ),
-    h6 = TextStyle(
-        fontSize = 20.sp,
-        fontWeight = FontWeight.Bold,
-        fontFamily = Inter
-    ),
-    caption = TextStyle(
+    displayLarge = TextStyle(
         fontFamily = Inter,
-        fontSize = 13.sp
+        fontSize = 57.sp,
+        fontWeight = FontWeight.Normal,
     ),
-    subtitle1 = TextStyle(
+    displayMedium = TextStyle(
+        fontFamily = Inter,
+        fontSize = 45.sp,
+        fontWeight = FontWeight.Normal,
+    ),
+    displaySmall = TextStyle(
+        fontFamily = Inter,
+        fontSize = 36.sp,
+        fontWeight = FontWeight.Normal,
+    ),
+    headlineLarge = TextStyle(
+        fontFamily = Inter,
+        fontSize = 32.sp,
+        fontWeight = FontWeight.Normal,
+    ),
+    headlineMedium = TextStyle(
+        fontFamily = Inter,
+        fontSize = 28.sp,
+        fontWeight = FontWeight.Normal,
+    ),
+    headlineSmall = TextStyle(
+        fontFamily = Inter,
+        fontSize = 24.sp,
+        fontWeight = FontWeight.Normal,
+    ),
+    titleLarge = TextStyle(
+        fontFamily = Inter,
+        fontSize = 22.sp,
+        fontWeight = FontWeight.Normal,
+    ),
+    titleMedium = TextStyle(
         fontFamily = Inter,
         fontSize = 16.sp,
-        fontWeight = FontWeight.Bold,
+        fontWeight = FontWeight.Medium,
     ),
-    subtitle2 = TextStyle(
+    titleSmall = TextStyle(
         fontFamily = Inter,
-        fontWeight = FontWeight.SemiBold,
         fontSize = 14.sp,
+        fontWeight = FontWeight.Medium,
     ),
-    body1 = TextStyle(
-        fontSize = 13.sp
+    bodyLarge = TextStyle(
+        fontSize = 16.sp,
+        fontWeight = FontWeight.Normal,
+    ),
+    bodyMedium = TextStyle(
+        fontSize = 14.sp,
+        fontWeight = FontWeight.Normal,
+    ),
+    bodySmall = TextStyle(
+        fontSize = 12.sp,
+        fontWeight = FontWeight.Normal,
+    ),
+    labelLarge = TextStyle(
+        fontFamily = Inter,
+        fontSize = 14.sp,
+        fontWeight = FontWeight.Medium,
+    ),
+    labelMedium = TextStyle(
+        fontFamily = Inter,
+        fontSize = 12.sp,
+        fontWeight = FontWeight.Medium,
+    ),
+    labelSmall = TextStyle(
+        fontFamily = Inter,
+        fontSize = 11.sp,
+        fontWeight = FontWeight.Medium,
     ),
-    body2 = TextStyle(
-        fontSize = 12.sp
-    )
 )
 
-val shapes = Shapes(
-    medium = RoundedCornerShape(8.dp)
-)
-
-val Colors.red: Color
-    get() = if (isLight) Color(0xFFE53935) else Color(0xFFE57373)
-
-val Colors.pink: Color
-    get() = if (isLight) Color(0xFFD81B60) else Color(0xFFF06292)
-
-val Colors.purple: Color
-    get() = if (isLight) Color(0xFF8E24AA) else Color(0xFFBA68C8)
-
-val Colors.deepPurple: Color
-    get() = if (isLight) Color(0xFF5E35B1) else Color(0xFF9575CD)
-
-val Colors.indigo: Color
-    get() = if (isLight) Color(0xFF3949AB) else Color(0xFF7986CB)
-
-val Colors.blue: Color
-    get() = if (isLight) Color(0xFF039BE5) else Color(0xFF4FC3F7)
-
-val Colors.lightBlue: Color
-    get() = if (isLight) Color(0xFF1E88E5) else Color(0xFF64B5F6)
-
-val Colors.cyan: Color
-    get() = if (isLight) Color(0xFF00ACC1) else Color(0xFF4DD0E1)
-
-val Colors.teal: Color
-    get() = if (isLight) Color(0xFF00897B) else Color(0xFF4DB6AC)
-
-val Colors.green: Color
-    get() = if (isLight) Color(0xFF388E3C) else Color(0xFF81C784)
-
-val Colors.lightGreen: Color
-    get() = if (isLight) Color(0xFF7CB342) else Color(0xFFAED581)
-
-
-val Colors.lime: Color
-    get() = if (isLight) Color(0xFFC0CA33) else Color(0xFFDCE775)
-
-val Colors.yellow: Color
-    get() = if (isLight) Color(0xFFFDD835) else Color(0xFFFFF176)
-
-val Colors.amber: Color
-    get() = if (isLight) Color(0xFFFFB300) else Color(0xFFFFD54F)
-
-val Colors.orange: Color
-    get() = if (isLight) Color(0xFFFB8C00) else Color(0xFFFFB74D)
-
-val Colors.deepOrange: Color
-    get() = if (isLight) Color(0xFFF4511E) else Color(0xFFFF8A65)
-
-val Colors.brown: Color
-    get() = if (isLight) Color(0xFF6D4C41) else Color(0xFFA1887F)
-
-val Colors.gray: Color
-    get() = if (isLight) Color(0xFF757575) else Color(0xFFE0E0E0)
-
-val Colors.blueGray: Color
-    get() = if (isLight) Color(0xFF546E7A) else Color(0xFF90A4AE)
-
-
-val Colors.androidGreen: Color
-    get() = if (isLight) Color(0xFF00A55B) else Color(0xFF00DE7A)
-
-val Colors.weatherSkyClear: Color
-    get() = Color(0xff4482ac)
-
-val Colors.weatherSkyClearNight: Color
-    get() = deepPurple
-
-val Colors.weatherSkyCloudy: Color
-    get() = gray
-
-val Colors.weatherSkyCloudyNight: Color
-    get() = gray
-
-val Colors.weatherSkyThunder: Color
-    get() = gray
-
-val Colors.weatherSkyThunderNight: Color
-    get() = gray
-
-val Colors.weatherCloudLight1: Color
-    get() = Color(0xFFECEFF1)
-
-val Colors.weatherCloudLight2: Color
-    get() = if (isLight) Color(0xFF90A4AE) else Color(0xFFCFD8DC)
-
-val Colors.weatherCloudMedium1: Color
-    get() = if (isLight) Color(0xFF546E7A) else Color(0xFF78909C)
-
-val Colors.weatherCloudMedium2: Color
-    get() = if (isLight) Color(0xFF455a64) else Color(0xFF607D8B)
-
-val Colors.weatherCloudDark1: Color
-    get() = if (isLight) Color(0xFF37474F) else Color(0xFF546E7A)
-
-val Colors.weatherCloudDark2: Color
-    get() = if (isLight) Color(0xFF263238) else Color(0xFF455A64)
-
-val Colors.weatherSun: Color
-    get() = amber
-
-val Colors.weatherMoon: Color
-    get() = if (isLight) Color(0xFF9E9E9E) else Color(0xFFE0E0E0)
-
-val Colors.weatherBolt: Color
-    get() = amber
-
-val Colors.weatherHot: Color
-    get() = red
-
-val Colors.weatherCold: Color
-    get() = lightBlue
-
-val Colors.weatherWind: Color
-    get() = if (isLight) Color(0xFF90A4AE) else Color(0xFFCFD8DC)
-
-val Colors.weatherWindDark: Color
-    get() = if (isLight) Color(0xFF546E7A) else Color(0xFF78909C)
-
-val Colors.weatherRain: Color
-    get() = blue
-
-val Colors.weatherHail: Color
-    get() = if (isLight) Color(0xFFBBDEFB) else Color(0xFFE3F2FD)
-
-val Colors.weatherSnow: Color
-    get() = if (isLight) Color(0xFFE0E0E0) else Color(0xFFF5F5F5)
-
-val Colors.weatherFog: Color
-    get() = weatherCloudLight2
-
 @Composable
 fun LauncherTheme(content: @Composable () -> Unit) {
 
@@ -244,33 +125,20 @@ fun LauncherTheme(content: @Composable () -> Unit) {
     val colorScheme = LocalColorScheme.current
 
     val colors = if (darkTheme) {
-        darkColors(
-            onSurface = colorScheme.neutral2.shade10,
-            surface = colorScheme.neutral2.shade800,
-            onBackground = colorScheme.neutral2.shade10,
-            background = colorScheme.neutral2.shade900,
-            primary = colorScheme.accent1.shade300,
-            primaryVariant = colorScheme.accent1.shade400,
-            secondary = colorScheme.accent2.shade300,
-            secondaryVariant = colorScheme.accent3.shade300,
-        )
+        colorScheme.toDarkColorScheme()
     } else {
-        lightColors(
-            surface = colorScheme.neutral1.shade0,
-            onSurface = colorScheme.neutral2.shade1000,
-            onBackground = colorScheme.neutral2.shade1000,
-            background = colorScheme.neutral1.shade50,
-            primary = colorScheme.accent1.shade600,
-            primaryVariant = colorScheme.accent1.shade700,
-            secondary = colorScheme.accent2.shade600,
-            secondaryVariant = colorScheme.accent3.shade600,
+        colorScheme.toLightColorScheme()
+    }
+
+    androidx.compose.material.MaterialTheme(
+        colors = if (darkTheme) darkColors() else lightColors()
+    ) {
+        MaterialTheme(
+            colorScheme = colors,
+            typography = typography,
+            content = content
         )
     }
 
-    MaterialTheme(
-        colors = colors,
-        typography = typography,
-        shapes = shapes,
-        content = content
-    )
+
 }

ui/src/main/java/de/mm20/launcher2/ui/ColorSchemeTest.kt

@@ -15,11 +15,11 @@ fun ColorSchemeTest() {
 
     Card {
         Column {
-            SwatchRow(swatch = colorScheme.neutral1)
-            SwatchRow(swatch = colorScheme.neutral2)
-            SwatchRow(swatch = colorScheme.accent1)
-            SwatchRow(swatch = colorScheme.accent2)
-            SwatchRow(swatch = colorScheme.accent3)
+            SwatchRow(swatch = colorScheme.neutral)
+            SwatchRow(swatch = colorScheme.neutralVariant)
+            SwatchRow(swatch = colorScheme.primary)
+            SwatchRow(swatch = colorScheme.secondary)
+            SwatchRow(swatch = colorScheme.tertiary)
         }
     }
 }
@@ -31,42 +31,42 @@ fun SwatchRow(swatch: ColorSwatch) {
     ) {
         Box(modifier = Modifier
             .height(24.dp).weight(1f)
-            .background(swatch.shade0))
+            .background(swatch.shade100))
         Box(modifier = Modifier
             .height(24.dp).weight(1f)
-            .background(swatch.shade10))
+            .background(swatch.shade99))
+        Box(modifier = Modifier
+            .height(24.dp).weight(1f)
+            .background(swatch.shade95))
+        Box(modifier = Modifier
+            .height(24.dp).weight(1f)
+            .background(swatch.shade90))
+        Box(modifier = Modifier
+            .height(24.dp).weight(1f)
+            .background(swatch.shade80))
+        Box(modifier = Modifier
+            .height(24.dp).weight(1f)
+            .background(swatch.shade70))
+        Box(modifier = Modifier
+            .height(24.dp).weight(1f)
+            .background(swatch.shade60))
         Box(modifier = Modifier
             .height(24.dp).weight(1f)
             .background(swatch.shade50))
         Box(modifier = Modifier
             .height(24.dp).weight(1f)
-            .background(swatch.shade100))
+            .background(swatch.shade40))
         Box(modifier = Modifier
             .height(24.dp).weight(1f)
-            .background(swatch.shade200))
+            .background(swatch.shade30))
         Box(modifier = Modifier
             .height(24.dp).weight(1f)
-            .background(swatch.shade300))
+            .background(swatch.shade20))
         Box(modifier = Modifier
             .height(24.dp).weight(1f)
-            .background(swatch.shade400))
+            .background(swatch.shade10))
         Box(modifier = Modifier
             .height(24.dp).weight(1f)
-            .background(swatch.shade500))
-        Box(modifier = Modifier
-            .height(24.dp).weight(1f)
-            .background(swatch.shade600))
-        Box(modifier = Modifier
-            .height(24.dp).weight(1f)
-            .background(swatch.shade700))
-        Box(modifier = Modifier
-            .height(24.dp).weight(1f)
-            .background(swatch.shade800))
-        Box(modifier = Modifier
-            .height(24.dp).weight(1f)
-            .background(swatch.shade900))
-        Box(modifier = Modifier
-            .height(24.dp).weight(1f)
-            .background(swatch.shade1000))
+            .background(swatch.shade0))
     }
 }

ui/src/main/java/de/mm20/launcher2/ui/InformationText.kt

@@ -4,7 +4,10 @@ import androidx.compose.foundation.BorderStroke
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
-import androidx.compose.material.*
+import androidx.compose.material.Card
+import androidx.compose.material.ContentAlpha
+import androidx.compose.material.LocalContentAlpha
+import androidx.compose.material3.*
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.ui.Modifier
@@ -27,7 +30,7 @@ fun InformationText(
         CompositionLocalProvider(LocalContentAlpha provides ContentAlpha.medium) {
             Text(
                     text = text,
-                    style = MaterialTheme.typography.body2,
+                    style = MaterialTheme.typography.bodyMedium,
                     modifier = (if (onClick != null) Modifier.clickable(onClick = onClick) else Modifier).padding(12.dp)
             )
         }

ui/src/main/java/de/mm20/launcher2/ui/LegacyAppTheme.kt

@@ -1,57 +1,73 @@
 package de.mm20.launcher2.ui
 
 import androidx.compose.foundation.isSystemInDarkTheme
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.Typography
-import androidx.compose.material.darkColors
-import androidx.compose.material.lightColors
+import androidx.compose.material3.*
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.sp
 
 val legacyTypography = Typography(
-    h1 = TextStyle(
-        fontSize = 96.sp,
-        fontWeight = FontWeight.Light,
-    ),
-    h2 = TextStyle(
-        fontSize = 60.sp,
-        fontWeight = FontWeight.Light,
-    ),
-    h3 = TextStyle(
-        fontSize = 48.sp,
+    displayLarge = TextStyle(
+        fontSize = 57.sp,
         fontWeight = FontWeight.Normal,
     ),
-    h4 = TextStyle(
-        fontSize = 34.sp,
+    displayMedium = TextStyle(
+        fontSize = 45.sp,
         fontWeight = FontWeight.Normal,
     ),
-    h5 = TextStyle(
+    displaySmall = TextStyle(
+        fontSize = 36.sp,
+        fontWeight = FontWeight.Normal,
+    ),
+    headlineLarge = TextStyle(
+        fontSize = 32.sp,
+        fontWeight = FontWeight.Normal,
+    ),
+    headlineMedium = TextStyle(
+        fontSize = 28.sp,
+        fontWeight = FontWeight.Normal,
+    ),
+    headlineSmall = TextStyle(
         fontSize = 24.sp,
+        fontWeight = FontWeight.Normal,
+    ),
+    titleLarge = TextStyle(
+        fontSize = 22.sp,
+        fontWeight = FontWeight.Normal,
+    ),
+    titleMedium = TextStyle(
+        fontSize = 16.sp,
         fontWeight = FontWeight.Medium,
     ),
-    h6 = TextStyle(
-        fontSize = 20.sp,
-        fontWeight = FontWeight.Bold,
-    ),
-    caption = TextStyle(
-        fontSize = 13.sp
-    ),
-    subtitle1 = TextStyle(
-        fontSize = 16.sp,
-        fontWeight = FontWeight.Bold,
-    ),
-    subtitle2 = TextStyle(
-        fontWeight = FontWeight.SemiBold,
+    titleSmall = TextStyle(
         fontSize = 14.sp,
+        fontWeight = FontWeight.Medium,
     ),
-    body1 = TextStyle(
-        fontSize = 14.sp
+    bodyLarge = TextStyle(
+        fontSize = 16.sp,
+        fontWeight = FontWeight.Normal,
+    ),
+    bodyMedium = TextStyle(
+        fontSize = 14.sp,
+        fontWeight = FontWeight.Normal,
+    ),
+    bodySmall = TextStyle(
+        fontSize = 12.sp,
+        fontWeight = FontWeight.Normal,
+    ),
+    labelLarge = TextStyle(
+        fontSize = 14.sp,
+        fontWeight = FontWeight.Medium,
+    ),
+    labelMedium = TextStyle(
+        fontSize = 12.sp,
+        fontWeight = FontWeight.Medium,
+    ),
+    labelSmall = TextStyle(
+        fontSize = 11.sp,
+        fontWeight = FontWeight.Medium,
     ),
-    body2 = TextStyle(
-        fontSize = 13.sp
-    )
 )
 
 @Composable
@@ -59,6 +75,6 @@ fun LegacyLauncherTheme(content: @Composable () -> Unit) {
     MaterialTheme(
         typography = legacyTypography,
         content = content,
-        colors = if (isSystemInDarkTheme()) darkColors() else lightColors()
+        colorScheme = if (isSystemInDarkTheme()) darkColorScheme() else lightColorScheme()
     )
 }

ui/src/main/java/de/mm20/launcher2/ui/ShapedLauncherIcon.kt

@@ -8,9 +8,9 @@ import androidx.compose.foundation.interaction.collectIsPressedAsState
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.requiredSize
 import androidx.compose.foundation.layout.size
-import androidx.compose.material.Icon
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.Surface
+import androidx.compose.material3.Icon
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Surface
 import androidx.compose.runtime.*
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -85,7 +85,7 @@ fun ShapedLauncherIcon(
 
     Surface(
         shape = iconShape,
-        elevation = animateDpAsState(if (isPressed) 4.dp else 1.dp).value,
+        shadowElevation = animateDpAsState(if (isPressed) 4.dp else 1.dp).value,
         modifier = modifier
             .requiredSize(size)
     ) {
@@ -94,7 +94,7 @@ fun ShapedLauncherIcon(
                 .requiredSize(size)
                 .background(
                     color = if (icon == null) {
-                        placeholder.color.copy(alpha = 0.4f).compositeOver(MaterialTheme.colors.surface)
+                        placeholder.color.copy(alpha = 0.4f).compositeOver(MaterialTheme.colorScheme.surface)
                     } else {
                         Color.Gray
                     }

ui/src/main/java/de/mm20/launcher2/ui/activity/ComposeActivity.kt

@@ -59,24 +59,24 @@ class ComposeActivity : AppCompatActivity() {
                 .collectAsState(initial = Settings.AppearanceSettings.ColorScheme.Default)
 
             val colorScheme = when (colorSchemePreference) {
-                Settings.AppearanceSettings.ColorScheme.MM20 -> MM20ColorScheme()
+                Settings.AppearanceSettings.ColorScheme.MM20 -> MM20ColorPalette()
                 Settings.AppearanceSettings.ColorScheme.Wallpaper -> {
                     if (isAtLeastApiLevel(Build.VERSION_CODES.O_MR1)) {
                         val wallpaperColors by wallpaperColorsAsState()
-                        WallpaperColorScheme(wallpaperColors)
-                    } else DefaultColorScheme()
+                        WallpaperColorPalette(wallpaperColors)
+                    } else DefaultColorPalette()
                 }
                 Settings.AppearanceSettings.ColorScheme.MaterialYou -> {
                     if (isAtLeastApiLevel(Build.VERSION_CODES.S)) {
-                        SystemColorScheme(context)
-                    } else DefaultColorScheme()
+                        SystemColorPalette(context)
+                    } else DefaultColorPalette()
                 }
-                Settings.AppearanceSettings.ColorScheme.BlackAndWhite -> BlackWhiteColorScheme()
+                Settings.AppearanceSettings.ColorScheme.BlackAndWhite -> BlackWhiteColorPalette()
                 Settings.AppearanceSettings.ColorScheme.Custom -> {
                     val customColors by customColorsAsState()
-                    CustomColorScheme(customColors)
+                    CustomColorPalette(customColors)
                 }
-                else -> DefaultColorScheme()
+                else -> DefaultColorPalette()
             }
 
 

ui/src/main/java/de/mm20/launcher2/ui/compat/AnimatedVectorResourcePolyfill.kt

@@ -1,23 +0,0 @@
-package de.mm20.launcher2.ui.compat
-
-import androidx.annotation.DrawableRes
-import androidx.compose.material.MaterialTheme
-import androidx.compose.runtime.Composable
-import androidx.compose.ui.graphics.painter.ColorPainter
-import androidx.compose.ui.graphics.painter.Painter
-import androidx.compose.ui.res.painterResource
-import de.mm20.launcher2.ui.R
-
-@Composable
-fun animatedVectorResource(@DrawableRes id: Int): AnimatedVectorResourceStub {
-    return AnimatedVectorResourceStub(id)
-}
-
-class AnimatedVectorResourceStub(
-    val res: Int
-) {
-    @Composable
-    fun painterFor(atEnd: Boolean): Painter {
-        return ColorPainter(MaterialTheme.colors.onSurface)
-    }
-}

ui/src/main/java/de/mm20/launcher2/ui/component/Chip.kt

@@ -4,7 +4,7 @@ import androidx.compose.foundation.border
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.RowScope
 import androidx.compose.foundation.layout.padding
-import androidx.compose.material.MaterialTheme
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
@@ -15,7 +15,7 @@ fun Chip(
 ) {
     Row(
         modifier = Modifier
-            .border(1.dp, MaterialTheme.colors.onSurface.copy(alpha = 0.1f), shape = MaterialTheme.shapes.large)
+            .border(1.dp, MaterialTheme.colorScheme.onSurface.copy(alpha = 0.1f))
             .padding(horizontal = 16.dp, vertical = 8.dp),
 
         content = content

ui/src/main/java/de/mm20/launcher2/ui/component/Clocks.kt

@@ -5,10 +5,10 @@ import androidx.compose.foundation.Canvas
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.shape.CircleShape
-import androidx.compose.material.LocalContentColor
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.Surface
-import androidx.compose.material.Text
+import androidx.compose.material3.LocalContentColor
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Surface
+import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -37,7 +37,7 @@ fun DigitalClock(time: Long) {
     Text(
         modifier = Modifier.padding(4.dp),
         text = format.format(time),
-        style = MaterialTheme.typography.h1.copy(
+        style = MaterialTheme.typography.displayLarge.copy(
             fontSize = 100.sp,
             fontWeight = FontWeight.Black,
             textAlign = TextAlign.Center,
@@ -86,12 +86,12 @@ fun AnalogClock(time: Long) {
     date.timeInMillis = time
     val minute = date[Calendar.MINUTE]
     val hour = date[Calendar.HOUR]
-    val dark = !MaterialTheme.colors.isLight
+    val dark = true//!MaterialTheme.colors.isLight
     val cs = LocalColorScheme.current
-    val bgColor = if (dark) cs.accent1.shade800 else cs.accent1.shade200
-    val hourColor = if (dark) cs.accent1.shade300 else cs.accent1.shade600
-    val minuteColor = if (dark) cs.accent1.shade200 else cs.accent1.shade700
-    val textColor = if (dark) cs.accent1.shade500 else cs.accent1.shade400
+    val bgColor = if (dark) cs.primary.shade20 else cs.primary.shade80
+    val hourColor = if (dark) cs.primary.shade70 else cs.primary.shade40
+    val minuteColor = if (dark) cs.primary.shade80 else cs.primary.shade30
+    val textColor = if (dark) cs.primary.shade50 else cs.primary.shade60
 
     val hourAngle = 30f * hour + 0.5f * minute
     val minuteAngle = 6f * minute
@@ -102,7 +102,7 @@ fun AnalogClock(time: Long) {
             .size(156.dp),
         shape = CircleShape,
         color = bgColor,
-        elevation = 8.dp
+        shadowElevation = 8.dp
     ) {
         Box(
             modifier = Modifier.fillMaxSize()
@@ -110,7 +110,7 @@ fun AnalogClock(time: Long) {
 
             Text(
                 text = "12",
-                style = MaterialTheme.typography.subtitle1.copy(
+                style = MaterialTheme.typography.headlineMedium.copy(
                     fontSize = 32.sp,
                     lineHeight = 32.sp,
                 ),
@@ -121,7 +121,7 @@ fun AnalogClock(time: Long) {
             )
             Text(
                 text = "3",
-                style = MaterialTheme.typography.subtitle1.copy(
+                style = MaterialTheme.typography.headlineMedium.copy(
                     fontSize = 32.sp
                 ),
                 color = textColor,
@@ -131,7 +131,7 @@ fun AnalogClock(time: Long) {
             )
             Text(
                 text = "6",
-                style = MaterialTheme.typography.subtitle1.copy(
+                style = MaterialTheme.typography.headlineMedium.copy(
                     fontSize = 32.sp
                 ),
                 color = textColor,
@@ -141,7 +141,7 @@ fun AnalogClock(time: Long) {
             )
             Text(
                 text = "9",
-                style = MaterialTheme.typography.subtitle1.copy(
+                style = MaterialTheme.typography.headlineMedium.copy(
                     fontSize = 32.sp
                 ),
                 color = textColor,

ui/src/main/java/de/mm20/launcher2/ui/component/ColorPicker.kt

@@ -2,10 +2,10 @@ package de.mm20.launcher2.ui.component
 
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.*
-import androidx.compose.material.MaterialTheme
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material.OutlinedTextField
 import androidx.compose.material.Slider
-import androidx.compose.material.Text
+import androidx.compose.material3.Text
 import androidx.compose.runtime.*
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -82,7 +82,7 @@ fun ColorPicker(
             Text(
                 "Hex: ",
                 modifier = Modifier.weight(2f),
-                style = MaterialTheme.typography.subtitle2
+                style = MaterialTheme.typography.titleMedium
             )
             OutlinedTextField(
                 value = hex,
@@ -114,7 +114,7 @@ private fun SliderRow(
         Text(
             label,
             modifier = Modifier.weight(1f),
-            style = MaterialTheme.typography.subtitle2
+            style = MaterialTheme.typography.titleMedium
         )
         Box(
             modifier = Modifier.weight(7f)

ui/src/main/java/de/mm20/launcher2/ui/component/DefaultSwipeActions.kt

@@ -13,6 +13,8 @@ import androidx.compose.material.icons.rounded.Star
 import androidx.compose.material.icons.rounded.StarBorder
 import androidx.compose.material.icons.rounded.Visibility
 import androidx.compose.material.icons.rounded.VisibilityOff
+import androidx.compose.material3.Icon
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.livedata.observeAsState
@@ -24,7 +26,6 @@ import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.unit.IntOffset
 import androidx.compose.ui.unit.LayoutDirection
 import androidx.compose.ui.unit.dp
-import androidx.lifecycle.viewmodel.compose.viewModel
 import de.mm20.launcher2.favorites.FavoritesViewModel
 import de.mm20.launcher2.search.data.Searchable
 import de.mm20.launcher2.ui.R
@@ -45,7 +46,7 @@ fun DefaultSwipeActions(
     val isPinned by viewModel.isPinned(item).observeAsState()
     val isHidden by viewModel.isHidden(item).observeAsState()
 
-    val state = rememberSwipeableState(
+    val state = androidx.compose.material.rememberSwipeableState(
         SwipeAction.Default,
         confirmStateChange = {
             if (it == SwipeAction.Favorites) {
@@ -96,7 +97,7 @@ fun DefaultSwipeActions(
                     modifier = Modifier.matchParentSize()
                 ) {
                     Card(
-                        backgroundColor = MaterialTheme.colors.onSurface.copy(alpha = ContentAlpha.divider),
+                        backgroundColor = MaterialTheme.colorScheme.onSurface.copy(alpha = ContentAlpha.divider),
                         modifier = Modifier.fillMaxSize(),
                         elevation = 0.dp
                     ) {
@@ -132,7 +133,7 @@ fun DefaultSwipeActions(
                                         Icons.Rounded.VisibilityOff
                                     }
                                 },
-                                tint = animateColorAsState(if (isDismissing) MaterialTheme.colors.onPrimary else MaterialTheme.colors.onSurface).value,
+                                tint = animateColorAsState(if (isDismissing) MaterialTheme.colorScheme.onPrimary else MaterialTheme.colorScheme.onSurface).value,
                                 modifier = Modifier
                                     .padding(horizontal = 16.dp)
                                     .scale(animateFloatAsState(if (isDismissing) 1.2f else 1f).value),

ui/src/main/java/de/mm20/launcher2/ui/component/LottieIcon.kt

@@ -4,7 +4,7 @@ package de.mm20.launcher2.ui.component
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.requiredSize
 import androidx.compose.foundation.layout.size
-import androidx.compose.material.LocalContentAlpha
+import androidx.compose.material3.LocalContentAlpha
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.alpha

ui/src/main/java/de/mm20/launcher2/ui/component/SearchBar.kt

@@ -8,8 +8,14 @@ import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.text.BasicText
 import androidx.compose.foundation.text.BasicTextField
 import androidx.compose.material.*
+import androidx.compose.material3.*
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.rounded.Search
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
+import androidx.compose.material3.LocalContentColor
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Text
 import androidx.compose.runtime.*
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -142,7 +148,7 @@ fun SearchBar(
                     }) {
                         Text(
                             stringResource(id = R.string.wallpaper),
-                            style = MaterialTheme.typography.subtitle2
+                            style = MaterialTheme.typography.titleMedium
                         )
                     }
                     DropdownMenuItem(onClick = {
@@ -151,7 +157,7 @@ fun SearchBar(
                     }) {
                         Text(
                             stringResource(id = R.string.title_activity_settings),
-                            style = MaterialTheme.typography.subtitle2
+                            style = MaterialTheme.typography.titleMedium
                         )
                     }
                 }

ui/src/main/java/de/mm20/launcher2/ui/component/SearchColumn.kt

@@ -7,8 +7,8 @@ import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.LazyListScope
 import androidx.compose.foundation.lazy.LazyListState
 import androidx.compose.material.Divider
-import androidx.compose.material.LocalContentColor
-import androidx.compose.material.MaterialTheme
+import androidx.compose.material3.LocalContentColor
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.ui.Modifier
@@ -26,7 +26,7 @@ fun SearchColumn(
 
     Box(
         modifier = modifier
-            .background(MaterialTheme.colors.background)
+            .background(MaterialTheme.colorScheme.background)
             .fillMaxHeight()
             .statusBarsPadding()
             .navigationBarsWithImePadding()
@@ -39,7 +39,7 @@ fun SearchColumn(
         val wikipedia = wikipediaResult()
 
 
-        CompositionLocalProvider(LocalContentColor provides MaterialTheme.colors.onSurface) {
+        CompositionLocalProvider(LocalContentColor provides MaterialTheme.colorScheme.onSurface) {
             LazyColumn(
                 contentPadding = PaddingValues(8.dp),
                 state = listState

ui/src/main/java/de/mm20/launcher2/ui/component/TextClock.kt

@@ -5,8 +5,8 @@ import android.content.Context
 import android.content.Intent
 import android.content.IntentFilter
 import android.text.format.DateUtils
-import androidx.compose.material.LocalTextStyle
-import androidx.compose.material.Text
+import androidx.compose.material3.LocalTextStyle
+import androidx.compose.material3.Text
 import androidx.compose.runtime.*
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color

ui/src/main/java/de/mm20/launcher2/ui/component/Toolbar.kt

@@ -2,7 +2,9 @@ package de.mm20.launcher2.ui.component
 
 import androidx.compose.animation.animateContentSize
 import androidx.compose.foundation.layout.*
-import androidx.compose.material.*
+import androidx.compose.material.DropdownMenu
+import androidx.compose.material.DropdownMenuItem
+import androidx.compose.material3.*
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.rounded.*
 import androidx.compose.runtime.*
@@ -103,7 +105,7 @@ fun ColumnScope.OverflowMenuItems(items: List<ToolbarAction>, onDismiss: () -> U
                     ) {
                         Text(
                             action.label, modifier = Modifier.weight(1f),
-                            style = MaterialTheme.typography.subtitle2
+                            style = MaterialTheme.typography.titleMedium
                         )
                         Icon(imageVector = Icons.Rounded.ArrowRight, contentDescription = null)
                     }
@@ -114,7 +116,7 @@ fun ColumnScope.OverflowMenuItems(items: List<ToolbarAction>, onDismiss: () -> U
                     ) {
                         Text(
                             action.label,
-                            style = MaterialTheme.typography.subtitle2
+                            style = MaterialTheme.typography.titleMedium
                         )
                     }
                 }
@@ -125,7 +127,7 @@ fun ColumnScope.OverflowMenuItems(items: List<ToolbarAction>, onDismiss: () -> U
                     }) {
                         Text(
                             action.label,
-                            style = MaterialTheme.typography.subtitle2
+                            style = MaterialTheme.typography.titleMedium
                         )
                     }
                 }

ui/src/main/java/de/mm20/launcher2/ui/component/WidgetColumn.kt

@@ -9,7 +9,7 @@ import androidx.compose.foundation.ScrollState
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.verticalScroll
-import androidx.compose.material.*
+import androidx.compose.material3.*
 import androidx.compose.runtime.*
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.ExperimentalComposeUiApi
@@ -48,7 +48,7 @@ fun WidgetColumn(
         widgets = viewModel.getWidgets()
     }
 
-    val isLightTheme = MaterialTheme.colors.isLight
+    val isLightTheme = androidx.compose.material.MaterialTheme.colors.isLight
 
     val windowHeight = LocalWindowSize.current.height
 
@@ -60,7 +60,7 @@ fun WidgetColumn(
             .background(
                 Brush.verticalGradient(
                     background to Color.Transparent,
-                    background to MaterialTheme.colors.background
+                    background to MaterialTheme.colorScheme.background
                 )
             )
     ) {
@@ -94,7 +94,7 @@ fun WidgetColumn(
                 icon = {
                     Icon(painter = icon.painterFor(atEnd = editMode), contentDescription = null)
                 },
-                backgroundColor = MaterialTheme.colors.surface,
+                containerColor = MaterialTheme.colorScheme.tertiaryContainer,
                 onClick = {
                     editMode = !editMode
                 })

ui/src/main/java/de/mm20/launcher2/ui/component/preferences/ColorPreference.kt

@@ -5,7 +5,8 @@ import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.foundation.verticalScroll
-import androidx.compose.material.*
+import androidx.compose.material.Card
+import androidx.compose.material3.*
 import androidx.compose.runtime.*
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
@@ -53,7 +54,7 @@ fun ColorPreference(
                 ) {
                     Text(
                         text = title,
-                        style = MaterialTheme.typography.h6,
+                        style = MaterialTheme.typography.headlineMedium,
                         modifier = Modifier.padding(
                             start = 24.dp, end = 24.dp, top = 16.dp, bottom = 8.dp
                         )
@@ -86,7 +87,6 @@ fun ColorPreference(
 fun ColorPreview(color: Color) {
     Surface(
         modifier = Modifier.size(32.dp),
-        elevation = 0.dp,
         shape = RoundedCornerShape(16.dp),
         color = color
     ) {}

ui/src/main/java/de/mm20/launcher2/ui/component/preferences/ListPreference.kt

@@ -4,7 +4,9 @@ import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.items
-import androidx.compose.material.*
+import androidx.compose.material.Card
+import androidx.compose.material.RadioButton
+import androidx.compose.material3.*
 import androidx.compose.runtime.*
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -45,7 +47,7 @@ fun <T> ListPreference(
                 ) {
                     Text(
                         text = title,
-                        style = MaterialTheme.typography.h6,
+                        style = MaterialTheme.typography.headlineMedium,
                         modifier = Modifier.padding(
                             start = 24.dp, end = 24.dp, top = 16.dp, bottom = 8.dp
                         )

ui/src/main/java/de/mm20/launcher2/ui/component/preferences/Preference.kt

@@ -2,7 +2,9 @@ package de.mm20.launcher2.ui.component.preferences
 
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.*
-import androidx.compose.material.*
+import androidx.compose.material.ContentAlpha
+import androidx.compose.material.LocalContentAlpha
+import androidx.compose.material3.*
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.ui.Alignment
@@ -39,18 +41,18 @@ fun Preference(
                         modifier = Modifier.padding(start = 4.dp),
                         imageVector = icon,
                         contentDescription = null,
-                        tint = MaterialTheme.colors.primary,
+                        tint = MaterialTheme.colorScheme.primary,
                     )
                 }
             }
             Column(
                 modifier = Modifier.weight(1f)
             ) {
-                Text(text = title, style = MaterialTheme.typography.subtitle2)
+                Text(text = title, style = MaterialTheme.typography.titleMedium)
                 if (summary != null) {
                     Text(
                         text = summary,
-                        style = MaterialTheme.typography.body1,
+                        style = MaterialTheme.typography.bodyMedium,
                         modifier = Modifier.padding(top = 1.dp)
                     )
                 }

ui/src/main/java/de/mm20/launcher2/ui/component/preferences/PreferenceCategory.kt

@@ -1,9 +1,9 @@
 package de.mm20.launcher2.ui.component.preferences
 
 import androidx.compose.foundation.layout.*
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.Surface
-import androidx.compose.material.Text
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Surface
+import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
@@ -15,7 +15,8 @@ fun PreferenceCategory(
     content: @Composable ColumnScope.() -> Unit
 ) {
     Surface(
-        elevation = 2.dp,
+        shadowElevation = 2.dp,
+        tonalElevation = 2.dp,
         modifier = Modifier.padding(bottom = 4.dp).fillMaxWidth()
     ) {
         Column {
@@ -27,8 +28,8 @@ fun PreferenceCategory(
                     Text(
                         modifier = Modifier.padding(start = 56.dp),
                         text = title,
-                        style = MaterialTheme.typography.subtitle2,
-                        color = MaterialTheme.colors.primary
+                        style = MaterialTheme.typography.titleSmall,
+                        color = MaterialTheme.colorScheme.primary
                     )
                 }
             }

ui/src/main/java/de/mm20/launcher2/ui/component/preferences/PreferenceScreen.kt

@@ -5,9 +5,9 @@ import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.LazyListScope
-import androidx.compose.material.*
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.rounded.ArrowBack
+import androidx.compose.material3.*
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
@@ -15,24 +15,23 @@ import com.google.accompanist.insets.systemBarsPadding
 import com.google.accompanist.systemuicontroller.rememberSystemUiController
 import de.mm20.launcher2.ui.locals.LocalNavController
 
+
+@OptIn(ExperimentalMaterial3Api::class)
 @Composable
 fun PreferenceScreen(
     title: String,
-    scaffoldState: ScaffoldState = rememberScaffoldState(),
     content: LazyListScope.() -> Unit
 ) {
     val navController = LocalNavController.current
     val systemUiController = rememberSystemUiController()
-    systemUiController.setStatusBarColor(MaterialTheme.colors.surface)
+    systemUiController.setStatusBarColor(MaterialTheme.colorScheme.surface)
     systemUiController.setNavigationBarColor(Color.Black)
     Box(
         modifier = Modifier.systemBarsPadding()
     ) {
         Scaffold(
-            scaffoldState = scaffoldState,
             topBar = {
-                TopAppBar(
-                    backgroundColor = MaterialTheme.colors.surface,
+                SmallTopAppBar(
                     title = {
                         Text(title)
                     },
@@ -42,14 +41,14 @@ fun PreferenceScreen(
                         }) {
                             Icon(imageVector = Icons.Rounded.ArrowBack, contentDescription = "Back")
                         }
-                    }
+                    },
                 )
             }) {
             LazyColumn(
                 modifier = Modifier
                     .fillMaxSize()
                     .padding(it),
-                content = content
+                content = content,
             )
         }
     }

ui/src/main/java/de/mm20/launcher2/ui/component/preferences/SwitchPreference.kt

@@ -1,6 +1,6 @@
 package de.mm20.launcher2.ui.component.preferences
 
-import androidx.compose.material.MaterialTheme
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material.Switch
 import androidx.compose.material.SwitchDefaults
 import androidx.compose.runtime.Composable
@@ -25,7 +25,7 @@ fun SwitchPreference(
         },
         controls = {
             Switch(checked = value, onCheckedChange = onValueChanged, colors = SwitchDefaults.colors(
-                uncheckedThumbColor = MaterialTheme.colors.onSurface
+                uncheckedThumbColor = MaterialTheme.colorScheme.onSurface
             ))
         }
     )

ui/src/main/java/de/mm20/launcher2/ui/icons/Searchable.kt

@@ -1,11 +1,12 @@
 package de.mm20.launcher2.ui.icons
 
-import androidx.compose.material.MaterialTheme
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.rounded.*
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.vector.ImageVector
+import androidx.compose.ui.res.colorResource
 import de.mm20.launcher2.search.data.Application
 import de.mm20.launcher2.search.data.File
 import de.mm20.launcher2.search.data.Searchable
@@ -31,7 +32,7 @@ fun Searchable.getPlaceholderIcon(): PlaceholderIcon {
 @Composable
 fun Application.getPlaceholderIcon(): PlaceholderIcon {
     return PlaceholderIcon(
-        MaterialTheme.colors.androidGreen,
+        colorResource(id = R.color.android_green),
         Icons.Rounded.Android
     )
 }
@@ -40,19 +41,19 @@ fun Application.getPlaceholderIcon(): PlaceholderIcon {
 fun File.getPlaceholderIcon(): PlaceholderIcon {
     return when {
         isDirectory -> PlaceholderIcon(
-            MaterialTheme.colors.lightBlue,
+            colorResource(id = R.color.lightblue),
             Icons.Rounded.Folder
         )
         mimeType.startsWith("image/") -> PlaceholderIcon(
-            MaterialTheme.colors.teal,
+            colorResource(id = R.color.teal),
             Icons.Rounded.Image
         )
         mimeType.startsWith("audio/") -> PlaceholderIcon(
-            MaterialTheme.colors.orange,
+            colorResource(id = R.color.orange),
             Icons.Rounded.Audiotrack
         )
         mimeType.startsWith("video/") -> PlaceholderIcon(
-            MaterialTheme.colors.purple,
+            colorResource(id = R.color.purple),
             Icons.Rounded.Movie
         )
         /*
@@ -66,7 +67,7 @@ fun File.getPlaceholderIcon(): PlaceholderIcon {
         }*/
         else -> when (mimeType) {
             "application/pdf" -> PlaceholderIcon(
-                MaterialTheme.colors.red,
+                colorResource(id = R.color.red),
                 Icons.Rounded.Pdf
             )
             "application/zip",
@@ -78,7 +79,7 @@ fun File.getPlaceholderIcon(): PlaceholderIcon {
             "application/x-zip-compressed",
             "application/x-gzip",
             "application/x-bzip2" -> PlaceholderIcon(
-                MaterialTheme.colors.brown,
+                colorResource(id = R.color.brown),
                 Icons.Rounded.Archive
             )
             "application/vnd.oasis.opendocument.text",
@@ -88,7 +89,7 @@ fun File.getPlaceholderIcon(): PlaceholderIcon {
             "application/x-iwork-pages-sffpages",
             "application/vnd.apple.pages",
             "application/vnd.google-apps.document" -> PlaceholderIcon(
-                MaterialTheme.colors.blue,
+                colorResource(id = R.color.blue),
                 Icons.Rounded.Notes
             )
             "application/vnd.oasis.opendocument.spreadsheet",
@@ -97,7 +98,7 @@ fun File.getPlaceholderIcon(): PlaceholderIcon {
             "application/x-iwork-numbers-sffnumbers",
             "application/vnd.apple.numbers",
             "application/vnd.google-apps.spreadsheet" -> PlaceholderIcon(
-                MaterialTheme.colors.lightGreen,
+                colorResource(id = R.color.lightgreen),
                 Icons.Rounded.BorderAll
             )
             "application/vnd.openxmlformats-officedocument.presentationml.presentation",
@@ -105,11 +106,11 @@ fun File.getPlaceholderIcon(): PlaceholderIcon {
             "application/x-iwork-keynote-sffkey",
             "application/vnd.apple.keynote",
             "application/vnd.google-apps.presentation" -> PlaceholderIcon(
-                MaterialTheme.colors.amber,
+                colorResource(id = R.color.amber),
                 Icons.Rounded.Slideshow
             )
             "application/vnd.android.package-archive" -> PlaceholderIcon(
-                MaterialTheme.colors.androidGreen,
+                colorResource(id = R.color.android_green),
                 Icons.Rounded.Android
             )
             "text/x-asm",
@@ -120,24 +121,24 @@ fun File.getPlaceholderIcon(): PlaceholderIcon {
             "text/x-script.perl",
             "text/javascript",
             "application/json" -> PlaceholderIcon(
-                MaterialTheme.colors.pink,
+                colorResource(id = R.color.pink),
                 Icons.Rounded.Code
             )
             "text/xml",
             "text/html" -> PlaceholderIcon(
-                MaterialTheme.colors.deepOrange,
+                colorResource(id = R.color.deeporange),
                 Icons.Rounded.Code
             )
             "application/vnd.google-apps.form" -> PlaceholderIcon(
-                MaterialTheme.colors.deepPurple,
+                colorResource(id = R.color.deeppurple),
                 Icons.Rounded.ViewList
             )
             "application/epub+zip" -> PlaceholderIcon(
-                MaterialTheme.colors.blue,
+                colorResource(id = R.color.blue),
                 Icons.Rounded.Book
             )
             else -> PlaceholderIcon(
-                MaterialTheme.colors.blueGray,
+                colorResource(id = R.color.bluegrey),
                 Icons.Rounded.InsertDriveFile
             )
         }

ui/src/main/java/de/mm20/launcher2/ui/legacy/search/ApplicationDetailRepresentation.kt

@@ -272,7 +272,10 @@ class ApplicationDetailRepresentation : Representation, KoinComponent {
 
                 val viewModel : FavoritesViewModel by (context as AppCompatActivity).viewModel()
 
+                var count = 0
                 for (si in shortcuts) {
+                    if (count > 4) break
+                    count++
                     val view = Chip(context)
                     view.text = si.label
 
@@ -282,6 +285,8 @@ class ApplicationDetailRepresentation : Representation, KoinComponent {
                         context.resources.displayMetrics.densityDpi
                     )
 
+                    view.chipIconTint = null
+
                     view.chipStrokeWidth = 1 * context.dp
                     view.chipStrokeColor =
                         ContextCompat.getColorStateList(context, R.color.chip_stroke)

ui/src/main/java/de/mm20/launcher2/ui/legacy/view/LauncherCardView.kt

@@ -5,7 +5,6 @@ import android.content.res.ColorStateList
 import android.util.AttributeSet
 import com.google.android.material.card.MaterialCardView
 import de.mm20.launcher2.ktx.dp
-import de.mm20.launcher2.preferences.CardBackground
 import de.mm20.launcher2.preferences.LauncherPreferences
 import de.mm20.launcher2.ui.R
 import kotlin.math.roundToInt
@@ -41,12 +40,12 @@ open class LauncherCardView @JvmOverloads constructor(
         }
 
     init {
-        val cardColor = when (LauncherPreferences.instance.cardBackground) {
+        /*val cardColor = when (LauncherPreferences.instance.cardBackground) {
             CardBackground.DEFAULT-> context.getColor(R.color.cardview_background)
             CardBackground.BLACK -> context.getColor(R.color.cardview_background_black)
         }
-        setCardBackgroundColor(cardColor)
-        strokeColor = cardColor
+        setCardBackgroundColor(cardColor)*/
+        strokeColor = cardBackgroundColor.defaultColor
         strokeWidth = (LauncherPreferences.instance.cardStrokeWidth * dp).roundToInt()
         radius = LauncherPreferences.instance.cardRadius * dp
 

ui/src/main/java/de/mm20/launcher2/ui/legacy/widget/MusicWidget.kt

@@ -9,8 +9,8 @@ import android.view.View
 import android.widget.FrameLayout
 import androidx.appcompat.app.AppCompatActivity
 import androidx.compose.foundation.layout.Column
-import androidx.compose.material.LocalContentColor
-import androidx.compose.material.MaterialTheme
+import androidx.compose.material3.LocalContentColor
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.ui.platform.ComposeView
 import androidx.core.app.NotificationManagerCompat
@@ -59,7 +59,7 @@ class MusicWidget : LauncherWidget {
         composeView.setContent {
             LegacyLauncherTheme {
                 // TODO: Temporary solution until parent widget card is rewritten in Compose
-                CompositionLocalProvider(LocalContentColor provides MaterialTheme.colors.onSurface) {
+                CompositionLocalProvider(LocalContentColor provides MaterialTheme.colorScheme.onSurface) {
                     Column {
                         MusicWidget()
                     }

ui/src/main/java/de/mm20/launcher2/ui/legacy/widget/WeatherWidget.kt

@@ -5,8 +5,8 @@ import android.util.AttributeSet
 import android.view.View
 import android.widget.FrameLayout
 import androidx.compose.foundation.layout.Column
-import androidx.compose.material.LocalContentColor
-import androidx.compose.material.MaterialTheme
+import androidx.compose.material3.LocalContentColor
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.ui.platform.ComposeView
 import de.mm20.launcher2.ui.LegacyLauncherTheme
@@ -44,7 +44,7 @@ class WeatherWidget : LauncherWidget {
         composeView.setContent {
             LegacyLauncherTheme {
                 // TODO: Temporary solution until parent widget card is rewritten in Compose
-                CompositionLocalProvider(LocalContentColor provides MaterialTheme.colors.onSurface) {
+                CompositionLocalProvider(LocalContentColor provides MaterialTheme.colorScheme.onSurface) {
                     Column {
                         WeatherWidget()
                     }

ui/src/main/java/de/mm20/launcher2/ui/locals/CompositionLocals.kt

@@ -5,8 +5,8 @@ import androidx.compose.runtime.compositionLocalOf
 import androidx.compose.ui.geometry.Size
 import androidx.navigation.NavController
 import de.mm20.launcher2.ui.theme.WallpaperColors
-import de.mm20.launcher2.ui.theme.colors.ColorScheme
-import de.mm20.launcher2.ui.theme.colors.DefaultColorScheme
+import de.mm20.launcher2.ui.theme.colors.ColorPalette
+import de.mm20.launcher2.ui.theme.colors.DefaultColorPalette
 
 val LocalWindowSize = compositionLocalOf { Size(0f, 0f) }
 
@@ -14,6 +14,6 @@ val LocalAppWidgetHost = compositionLocalOf<AppWidgetHost?>(defaultFactory = { n
 
 val LocalWallpaperColors = compositionLocalOf<WallpaperColors?> { null }
 
-val LocalColorScheme = compositionLocalOf<ColorScheme> { DefaultColorScheme() }
+val LocalColorScheme = compositionLocalOf<ColorPalette> { DefaultColorPalette() }
 
 val LocalNavController = compositionLocalOf<NavController?> { null }

ui/src/main/java/de/mm20/launcher2/ui/screens/LauncherMainScreen.kt

@@ -7,8 +7,7 @@ import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.lazy.rememberLazyListState
 import androidx.compose.foundation.rememberScrollState
-import androidx.compose.material.ExperimentalMaterialApi
-import androidx.compose.material.MaterialTheme
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.*
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
@@ -31,7 +30,6 @@ import kotlinx.coroutines.flow.combine
 import kotlinx.coroutines.launch
 
 @OptIn(
-    ExperimentalMaterialApi::class,
     ExperimentalAnimationApi::class,
     ExperimentalPagerApi::class,
     InternalCoroutinesApi::class
@@ -45,7 +43,7 @@ fun LauncherMainScreen() {
     val searchColumnState = rememberLazyListState()
     val widgetColumnState = rememberScrollState()
 
-    val isLightTheme = MaterialTheme.colors.isLight
+    val isLightTheme = androidx.compose.material.MaterialTheme.colors.isLight
 
     val windowHeight = LocalWindowSize.current.height
 

ui/src/main/java/de/mm20/launcher2/ui/screens/settings/SettingsAboutScreen.kt

@@ -2,11 +2,9 @@ package de.mm20.launcher2.ui.screens.settings
 
 import android.content.Intent
 import android.net.Uri
-import androidx.compose.material.SnackbarDuration
-import androidx.compose.material.SnackbarResult
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.rounded.Info
-import androidx.compose.material.rememberScaffoldState
+import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.ui.platform.LocalContext
@@ -27,15 +25,14 @@ import de.mm20.launcher2.ui.locals.LocalNavController
 import kotlinx.coroutines.launch
 import java.io.File
 
+@OptIn(ExperimentalMaterial3Api::class)
 @Composable
 fun SettingsAboutScreen() {
     val context = LocalContext.current
     val navController = LocalNavController.current
-    val scaffoldState = rememberScaffoldState()
     val scope = rememberCoroutineScope()
     PreferenceScreen(
         title = stringResource(id = R.string.preference_screen_about),
-        scaffoldState = scaffoldState
     ) {
         item {
             PreferenceCategory {
@@ -109,7 +106,7 @@ fun SettingsAboutScreen() {
                     onClick = {
                         scope.launch {
                             val path = DebugInformationDumper().dump(context)
-                            val result = scaffoldState.snackbarHostState.showSnackbar(
+                            /*val result = scaffoldState.snackbarHostState.showSnackbar(
                                 context.getString(R.string.debug_export_information_file, path),
                                 actionLabel = context.getString(R.string.menu_share),
                                 duration = SnackbarDuration.Long
@@ -125,7 +122,7 @@ fun SettingsAboutScreen() {
                                         )
                                     )
                                 })
-                            }
+                            }*/
                         }
                     }
                 )
@@ -134,7 +131,7 @@ fun SettingsAboutScreen() {
                     onClick = {
                         scope.launch {
                             val path = DebugInformationDumper().exportDatabases(context)
-                            val result = scaffoldState.snackbarHostState.showSnackbar(
+                            /*val result = scaffoldState.snackbarHostState.showSnackbar(
                                 context.getString(R.string.debug_export_information_file, path),
                                 actionLabel = context.getString(R.string.menu_share),
                                 duration = SnackbarDuration.Long
@@ -150,7 +147,7 @@ fun SettingsAboutScreen() {
                                         )
                                     )
                                 })
-                            }
+                            }*/
                         }
                     }
                 )

ui/src/main/java/de/mm20/launcher2/ui/screens/settings/SettingsColorsScreen.kt

@@ -3,7 +3,7 @@ package de.mm20.launcher2.ui.screens.settings
 import android.os.Build
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.*
-import androidx.compose.material.MaterialTheme
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.rounded.RadioButtonChecked
 import androidx.compose.material.icons.rounded.RadioButtonUnchecked
@@ -43,17 +43,17 @@ fun SettingsColorsScreen() {
             val schemes = mutableListOf(
                 ColorSchemeItem(
                     ColorSchemeOption.Default,
-                    DefaultColorScheme(),
+                    DefaultColorPalette(),
                     stringResource(id = R.string.preference_colors_default)
                 ),
                 ColorSchemeItem(
                     ColorSchemeOption.MM20,
-                    MM20ColorScheme(),
+                    MM20ColorPalette(),
                     stringResource(id = R.string.preference_colors_mm20)
                 ),
                 ColorSchemeItem(
                     ColorSchemeOption.BlackAndWhite,
-                    BlackWhiteColorScheme(),
+                    BlackWhiteColorPalette(),
                     stringResource(id = R.string.preference_colors_bw)
                 )
             )
@@ -61,7 +61,7 @@ fun SettingsColorsScreen() {
                 schemes.add(
                     ColorSchemeItem(
                         ColorSchemeOption.MaterialYou,
-                        SystemColorScheme(context),
+                        SystemColorPalette(context),
                         stringResource(id = R.string.preference_colors_mdyou)
                     )
                 )
@@ -71,7 +71,7 @@ fun SettingsColorsScreen() {
                 schemes.add(
                     ColorSchemeItem(
                         ColorSchemeOption.Wallpaper,
-                        WallpaperColorScheme(wallpaperColors),
+                        WallpaperColorPalette(wallpaperColors),
                         stringResource(id = R.string.preference_colors_wallpaper)
                     )
                 )
@@ -79,7 +79,7 @@ fun SettingsColorsScreen() {
             schemes.add(
                 ColorSchemeItem(
                     ColorSchemeOption.Custom,
-                    CustomColorScheme(customColors),
+                    CustomColorPalette(customColors),
                     stringResource(id = R.string.preference_colors_custom)
                 )
             )
@@ -89,7 +89,7 @@ fun SettingsColorsScreen() {
                         title = scheme.label,
                         icon = if (colorScheme == scheme.value) Icons.Rounded.RadioButtonChecked else Icons.Rounded.RadioButtonUnchecked,
                         controls = {
-                            ColorSchemePreview(scheme.colorScheme)
+                            ColorSchemePreview(scheme.colorPalette)
                         },
                         onClick = {
                             scope.launch {
@@ -196,13 +196,13 @@ fun SettingsColorsScreen() {
 }
 
 @Composable
-private fun ColorSchemePreview(colorScheme: ColorScheme) {
-    val isDark = !MaterialTheme.colors.isLight
-    val neutral1 = if (isDark) colorScheme.neutral1.shade800 else colorScheme.neutral1.shade100
-    val neutral2 = if (isDark) colorScheme.neutral2.shade800 else colorScheme.neutral2.shade100
-    val accent1 = if (isDark) colorScheme.accent1.shade300 else colorScheme.accent1.shade500
-    val accent2 = if (isDark) colorScheme.accent2.shade300 else colorScheme.accent2.shade500
-    val accent3 = if (isDark) colorScheme.accent3.shade300 else colorScheme.accent3.shade500
+private fun ColorSchemePreview(colorPalette: ColorPalette) {
+    val isDark = !androidx.compose.material.MaterialTheme.colors.isLight
+    val neutral1 = if (isDark) colorPalette.neutral.shade20 else colorPalette.neutral.shade90
+    val neutral2 = if (isDark) colorPalette.neutralVariant.shade20 else colorPalette.neutralVariant.shade90
+    val accent1 = if (isDark) colorPalette.primary.shade70 else colorPalette.primary.shade50
+    val accent2 = if (isDark) colorPalette.secondary.shade70 else colorPalette.secondary.shade50
+    val accent3 = if (isDark) colorPalette.tertiary.shade70 else colorPalette.tertiary.shade50
     Box(
         modifier = Modifier.height(48.dp),
         contentAlignment = Alignment.Center
@@ -250,6 +250,6 @@ private fun ColorSchemePreview(colorScheme: ColorScheme) {
 
 private data class ColorSchemeItem(
     val value: ColorSchemeOption,
-    val colorScheme: ColorScheme,
+    val colorPalette: ColorPalette,
     val label: String,
 )

ui/src/main/java/de/mm20/launcher2/ui/screens/settings/SettingsLicenseScreen.kt

@@ -7,10 +7,10 @@ import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
-import androidx.compose.material.Icon
-import androidx.compose.material.LocalContentColor
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.Text
+import androidx.compose.material3.Icon
+import androidx.compose.material3.LocalContentColor
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Text
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.rounded.OpenInBrowser
 import androidx.compose.runtime.Composable
@@ -40,11 +40,11 @@ fun SettingsLicenseScreen(libraryName: String? = null) {
                 Column(
                     modifier = Modifier.padding(16.dp)
                 ) {
-                    Text(text = library.name, style = MaterialTheme.typography.subtitle1)
+                    Text(text = library.name, style = MaterialTheme.typography.titleMedium)
                     library.description?.let { Text(text = it) }
                 }
                 CompositionLocalProvider(
-                    LocalContentColor provides MaterialTheme.colors.primary
+                    LocalContentColor provides MaterialTheme.colorScheme.primary
                 ) {
                     Row(
                         modifier = Modifier
@@ -61,7 +61,7 @@ fun SettingsLicenseScreen(libraryName: String? = null) {
                         Text(
                             modifier = Modifier.padding(start = 8.dp),
                             text = stringResource(id = R.string.open_webpage),
-                            style = MaterialTheme.typography.button
+                            style = MaterialTheme.typography.labelMedium
                         )
                     }
                 }
@@ -74,7 +74,7 @@ fun SettingsLicenseScreen(libraryName: String? = null) {
                 ) {
                     Text(
                         text = stringResource(id = library.licenseName),
-                        style = MaterialTheme.typography.subtitle2
+                        style = MaterialTheme.typography.titleMedium
                     )
                     library.copyrightNote?.let {
                         Text(

ui/src/main/java/de/mm20/launcher2/ui/search/ApplicationItem.kt

@@ -5,8 +5,8 @@ import androidx.compose.animation.core.Spring
 import androidx.compose.animation.core.animateDpAsState
 import androidx.compose.animation.core.spring
 import androidx.compose.foundation.layout.*
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.Text
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Text
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.rounded.ArrowBack
 import androidx.compose.material.icons.rounded.Delete
@@ -62,21 +62,21 @@ fun ApplicationItem(
                     Column {
                         Text(
                             text = app.label,
-                            style = MaterialTheme.typography.subtitle1,
+                            style = MaterialTheme.typography.titleLarge,
                             maxLines = 1,
                             overflow = TextOverflow.Ellipsis,
                         )
                         app.version?.let {
                             Text(
                                 text = it,
-                                style = MaterialTheme.typography.body1,
+                                style = MaterialTheme.typography.bodyMedium,
                                 maxLines = 1,
                                 overflow = TextOverflow.Ellipsis,
                             )
                         }
                         Text(
                             text = app.`package`,
-                            style = MaterialTheme.typography.body1,
+                            style = MaterialTheme.typography.bodyMedium,
                             maxLines = 1,
                             overflow = TextOverflow.Ellipsis,
                         )

ui/src/main/java/de/mm20/launcher2/ui/search/BasicGridItem.kt

@@ -4,8 +4,8 @@ import androidx.compose.animation.AnimatedVisibility
 import androidx.compose.animation.ExperimentalAnimationApi
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.padding
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.Text
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier

ui/src/main/java/de/mm20/launcher2/ui/search/CalculatorItem.kt

@@ -4,7 +4,10 @@ import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.lazy.LazyListScope
-import androidx.compose.material.*
+import androidx.compose.material.Card
+import androidx.compose.material.ContentAlpha
+import androidx.compose.material.LocalContentAlpha
+import androidx.compose.material3.*
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.runtime.getValue
@@ -39,7 +42,7 @@ fun calculatorItem(): LazyListScope.() -> Unit {
                         }
                         Text(
                             text = "= ${it.formattedString}",
-                            style = MaterialTheme.typography.subtitle1,
+                            style = MaterialTheme.typography.titleLarge,
                             modifier = Modifier.align(Alignment.End),
                         )
                         if (it.term.matches(Regex("(0x|0b)?[0-9]+"))) {

ui/src/main/java/de/mm20/launcher2/ui/search/FileItem.kt

@@ -9,8 +9,8 @@ import androidx.compose.animation.core.spring
 import androidx.compose.foundation.ExperimentalFoundationApi
 import androidx.compose.foundation.combinedClickable
 import androidx.compose.foundation.layout.*
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.Text
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Text
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.rounded.ArrowBack
 import androidx.compose.material.icons.rounded.Delete
@@ -74,7 +74,7 @@ fun FileItem(
                     Column {
                         Text(
                             text = file.label,
-                            style = MaterialTheme.typography.subtitle2,
+                            style = MaterialTheme.typography.titleLarge,
                             maxLines = 1,
                             overflow = TextOverflow.Ellipsis,
                         )

ui/src/main/java/de/mm20/launcher2/ui/search/GridItemLabel.kt

@@ -3,8 +3,8 @@ package de.mm20.launcher2.ui.search
 import androidx.compose.foundation.layout.ColumnScope
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.Text
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -22,7 +22,7 @@ fun ColumnScope.GridItemLabel(
         maxLines = 1,
         overflow = TextOverflow.Ellipsis,
         textAlign = TextAlign.Center,
-        style = MaterialTheme.typography.body2,
+        style = MaterialTheme.typography.bodySmall,
         softWrap = false,
         modifier = Modifier
             .fillMaxWidth()

ui/src/main/java/de/mm20/launcher2/ui/search/SearchableGrid.kt

@@ -5,6 +5,7 @@ import androidx.compose.animation.ExperimentalAnimationApi
 import androidx.compose.animation.animateContentSize
 import androidx.compose.animation.core.animateDpAsState
 import androidx.compose.animation.core.animateFloatAsState
+import androidx.compose.foundation.ExperimentalFoundationApi
 import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.lazy.LazyListScope
 import androidx.compose.foundation.lazy.LazyListState
@@ -94,11 +95,11 @@ fun LazyListScope.NotSoLazySearchableGrid(
     }
 }
 
-@OptIn(ExperimentalAnimationApi::class)
+@OptIn(ExperimentalAnimationApi::class, ExperimentalFoundationApi::class)
 fun LazyListScope.SearchableGrid(
     items: List<Searchable>,
     columns: Int = 5,
-    listState: LazyListState
+    listState: LazyListState,
 ) {
     val rows = (items.size + columns - 1) / columns
 
@@ -109,6 +110,7 @@ fun LazyListScope.SearchableGrid(
         Row(
             modifier = Modifier
                 .requiredHeight(100.dp)
+                .animateItemPlacement()
                 .zIndex(
                     animateFloatAsState(
                         if (focusedItem != -1 && rowIndex == focusedItem / columns) 100f else 0f
@@ -125,7 +127,8 @@ fun LazyListScope.SearchableGrid(
                         hasFocus = itemIndex == focusedItem,
                         requestFocus = {
                             focusedItem = if (it) itemIndex else -1
-                        })
+                        }
+                    )
                 } else {
                     Spacer(Modifier.weight(1f, fill = true))
                 }
@@ -144,7 +147,8 @@ fun RowScope.GridItem(
     column: Int,
     totalColumns: Int,
     hasFocus: Boolean,
-    requestFocus: (Boolean) -> Unit
+    requestFocus: (Boolean) -> Unit,
+    modifier: Modifier = Modifier,
 ) {
     val insets = LocalWindowInsets.current.systemBars
 
@@ -178,7 +182,7 @@ fun RowScope.GridItem(
     val windowSize = LocalWindowSize.current
 
     Box(
-        modifier = Modifier
+        modifier = modifier
             .weight(1f, fill = true)
             .fillMaxHeight()
             .zIndex(z)

ui/src/main/java/de/mm20/launcher2/ui/search/SearchableItem.kt

@@ -7,7 +7,7 @@ import androidx.compose.animation.core.updateTransition
 import androidx.compose.foundation.ExperimentalFoundationApi
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material.Card
-import androidx.compose.material.MaterialTheme
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.*
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
@@ -73,7 +73,7 @@ fun SearchableItem(
 
 
         Card(
-            backgroundColor = MaterialTheme.colors.surface.copy(alpha = cardAlpha),
+            backgroundColor = MaterialTheme.colorScheme.surface.copy(alpha = cardAlpha),
             elevation = cardElevation
         ) {
 

ui/src/main/java/de/mm20/launcher2/ui/search/SearchableList.kt

@@ -1,8 +1,11 @@
 package de.mm20.launcher2.ui.search
 
+import androidx.compose.foundation.ExperimentalFoundationApi
+import androidx.compose.foundation.lazy.LazyItemScope
 import androidx.compose.foundation.lazy.LazyListScope
 import androidx.compose.foundation.lazy.items
 import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
 import de.mm20.launcher2.search.data.Searchable
 import de.mm20.launcher2.ui.component.SectionDivider
 
@@ -17,7 +20,8 @@ fun LazyListScope.SearchableList(
     }
 }
 
+@OptIn(ExperimentalFoundationApi::class)
 @Composable
-fun ListItem(item: Searchable) {
-    SearchableItem(item = item)
+fun LazyItemScope.ListItem(item: Searchable) {
+    SearchableItem(item = item, modifier = Modifier.animateItemPlacement())
 }

ui/src/main/java/de/mm20/launcher2/ui/search/WikipediaItem.kt

@@ -5,8 +5,8 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material.ContentAlpha
 import androidx.compose.material.LocalContentAlpha
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.Text
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Text
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.rounded.ArrowBack
 import androidx.compose.material.icons.rounded.Share
@@ -36,7 +36,7 @@ fun WikipediaItem(
         ) {
             Text(
                 text = wikipedia.label,
-                style = MaterialTheme.typography.subtitle1,
+                style = MaterialTheme.typography.titleLarge,
             )
             CompositionLocalProvider(LocalContentAlpha provides ContentAlpha.medium) {
                 Text(

ui/src/main/java/de/mm20/launcher2/ui/searchable/CalendarEventItem.kt

@@ -10,7 +10,8 @@ import androidx.compose.animation.core.animateFloatAsState
 import androidx.compose.foundation.BorderStroke
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.*
-import androidx.compose.material.*
+import androidx.compose.material.Card
+import androidx.compose.material3.*
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.rounded.ArrowBack
 import androidx.compose.material.icons.rounded.Star
@@ -35,7 +36,7 @@ import de.mm20.launcher2.ui.search.Representation
 import de.mm20.launcher2.ui.toPixels
 import java.net.URLEncoder
 
-@OptIn(ExperimentalMaterialApi::class, ExperimentalAnimationApi::class)
+@OptIn(ExperimentalAnimationApi::class)
 @Composable
 fun CalendarEventItem(
     event: CalendarEvent,
@@ -56,7 +57,7 @@ fun CalendarEventItem(
             elevation = animateDpAsState(if (representation == Representation.Full) 4.dp else 0.dp).value,
             border = BorderStroke(
                 width = animateDpAsState(if (representation == Representation.List) 1.dp else 0.dp).value,
-                color = MaterialTheme.colors.onSurface.copy(alpha = animateFloatAsState(if (representation == Representation.List) 0.18f else 0f).value)
+                color = MaterialTheme.colorScheme.onSurface.copy(alpha = animateFloatAsState(if (representation == Representation.List) 0.18f else 0f).value)
             ),
             modifier = modifier
         ) {
@@ -80,14 +81,14 @@ fun CalendarEventItem(
                     ) {
                         Text(
                             text = event.label,
-                            style = MaterialTheme.typography.subtitle2
+                            style = MaterialTheme.typography.titleMedium
                         )
                         AnimatedVisibility(
                             representation == Representation.List
                         ) {
                             Text(
                                 text = formatEventTime(event = event),
-                                style = MaterialTheme.typography.body1
+                                style = MaterialTheme.typography.bodyMedium
                             )
                         }
                     }

ui/src/main/java/de/mm20/launcher2/ui/theme/colors/BlackWhiteColorPalette.kt

@@ -2,8 +2,8 @@ package de.mm20.launcher2.ui.theme.colors
 
 import androidx.compose.ui.graphics.Color
 
-class BlackWhiteColorScheme: ColorScheme() {
-    override val neutral1: ColorSwatch
+class BlackWhiteColorPalette: ColorPalette() {
+    override val neutral: ColorSwatch
         get() = ColorSwatch(
             Color.White,
             Color.White,
@@ -19,12 +19,12 @@ class BlackWhiteColorScheme: ColorScheme() {
             Color.Black,
             Color.Black,
         )
-    override val neutral2: ColorSwatch
-        get() = neutral1
-    override val accent1: ColorSwatch
-        get() = neutral1
-    override val accent2: ColorSwatch
-        get() = neutral1
-    override val accent3: ColorSwatch
-        get() = neutral1
+    override val neutralVariant: ColorSwatch
+        get() = neutral
+    override val primary: ColorSwatch
+        get() = neutral
+    override val secondary: ColorSwatch
+        get() = neutral
+    override val tertiary: ColorSwatch
+        get() = neutral
 }

ui/src/main/java/de/mm20/launcher2/ui/theme/colors/ColorPalette.kt

@@ -0,0 +1,66 @@
+package de.mm20.launcher2.ui.theme.colors
+
+import androidx.compose.material3.ColorScheme
+import androidx.compose.material3.darkColorScheme
+import androidx.compose.material3.lightColorScheme
+
+abstract class ColorPalette {
+    abstract val neutral: ColorSwatch
+    abstract val neutralVariant: ColorSwatch
+
+    abstract val primary: ColorSwatch
+    abstract val secondary: ColorSwatch
+    abstract val tertiary: ColorSwatch
+}
+
+fun ColorPalette.toDarkColorScheme() : ColorScheme {
+    return darkColorScheme(
+        primary = primary.shade80,
+        onPrimary = primary.shade20,
+        primaryContainer = primary.shade30,
+        onPrimaryContainer = primary.shade90,
+        secondary = secondary.shade80,
+        onSecondary = secondary.shade20,
+        secondaryContainer = secondary.shade30,
+        onSecondaryContainer = secondary.shade90,
+        tertiary = tertiary.shade80,
+        onTertiary = tertiary.shade20,
+        tertiaryContainer = tertiary.shade30,
+        onTertiaryContainer = tertiary.shade90,
+        background = neutral.shade10,
+        onBackground = neutral.shade90,
+        surface = neutral.shade10,
+        onSurface = neutral.shade80,
+        surfaceVariant = neutralVariant.shade30,
+        onSurfaceVariant = neutralVariant.shade80,
+        outline = neutralVariant.shade60,
+        inverseOnSurface = neutralVariant.shade20,
+        inverseSurface = neutralVariant.shade90,
+    )
+}
+
+fun ColorPalette.toLightColorScheme() : ColorScheme {
+    return lightColorScheme(
+        primary = primary.shade40,
+        onPrimary = primary.shade100,
+        primaryContainer = primary.shade90,
+        onPrimaryContainer = primary.shade10,
+        secondary = secondary.shade40,
+        onSecondary = secondary.shade100,
+        secondaryContainer = secondary.shade90,
+        onSecondaryContainer = secondary.shade10,
+        tertiary = tertiary.shade40,
+        onTertiary = tertiary.shade100,
+        tertiaryContainer = tertiary.shade90,
+        onTertiaryContainer = tertiary.shade10,
+        background = neutral.shade99,
+        onBackground = neutral.shade10,
+        surface = neutral.shade99,
+        onSurface = neutral.shade10,
+        surfaceVariant = neutralVariant.shade90,
+        onSurfaceVariant = neutralVariant.shade30,
+        outline = neutralVariant.shade50,
+        inverseOnSurface = neutralVariant.shade95,
+        inverseSurface = neutralVariant.shade20,
+    )
+}

ui/src/main/java/de/mm20/launcher2/ui/theme/colors/ColorScheme.kt

@@ -1,12 +0,0 @@
-package de.mm20.launcher2.ui.theme.colors
-
-import androidx.compose.ui.graphics.Color
-
-abstract class ColorScheme {
-    abstract val neutral1: ColorSwatch
-    abstract val neutral2: ColorSwatch
-
-    abstract val accent1: ColorSwatch
-    abstract val accent2: ColorSwatch
-    abstract val accent3: ColorSwatch
-}

ui/src/main/java/de/mm20/launcher2/ui/theme/colors/ColorSwatch.kt

@@ -1,7 +1,6 @@
 package de.mm20.launcher2.ui.theme.colors
 
 import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.graphics.compositeOver
 import androidx.compose.ui.graphics.toArgb
 import androidx.core.graphics.ColorUtils
 import androidx.core.graphics.blue
@@ -9,19 +8,19 @@ import androidx.core.graphics.green
 import androidx.core.graphics.red
 
 data class ColorSwatch(
-    val shade0: Color,
-    val shade10: Color,
-    val shade50: Color,
     val shade100: Color,
-    val shade200: Color,
-    val shade300: Color,
-    val shade400: Color,
-    val shade500: Color,
-    val shade600: Color,
-    val shade700: Color,
-    val shade800: Color,
-    val shade900: Color,
-    val shade1000: Color,
+    val shade99: Color,
+    val shade95: Color,
+    val shade90: Color,
+    val shade80: Color,
+    val shade70: Color,
+    val shade60: Color,
+    val shade50: Color,
+    val shade40: Color,
+    val shade30: Color,
+    val shade20: Color,
+    val shade10: Color,
+    val shade0: Color,
 )
 
 fun colorSwatch(color: Color): ColorSwatch {
@@ -30,18 +29,18 @@ fun colorSwatch(color: Color): ColorSwatch {
     ColorUtils.RGBToHSL(rgb.red, rgb.green, rgb.blue, hsl)
 
     return ColorSwatch(
-        shade0 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 1f })),
-        shade10 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 0.99f })),
-        shade50 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 0.95f })),
-        shade100 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 0.9f })),
-        shade200 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 0.8f })),
-        shade300 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 0.7f })),
-        shade400 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 0.6f })),
-        shade500 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 0.49f })),
-        shade600 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 0.4f })),
-        shade700 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 0.3f })),
-        shade800 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 0.2f })),
-        shade900 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 0.1f })),
-        shade1000 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 0f })),
+        shade100 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 1f })),
+        shade99 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 0.99f })),
+        shade95 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 0.95f })),
+        shade90 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 0.9f })),
+        shade80 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 0.8f })),
+        shade70 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 0.7f })),
+        shade60 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 0.6f })),
+        shade50 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 0.49f })),
+        shade40 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 0.4f })),
+        shade30 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 0.3f })),
+        shade20 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 0.2f })),
+        shade10 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 0.1f })),
+        shade0 = Color(ColorUtils.HSLToColor(hsl.also { it[2] = 0f })),
     )
 }

ui/src/main/java/de/mm20/launcher2/ui/theme/colors/CustomColorPalette.kt

@@ -9,16 +9,16 @@ import androidx.compose.ui.platform.LocalContext
 import de.mm20.launcher2.preferences.dataStore
 import kotlinx.coroutines.flow.map
 
-class CustomColorScheme(val colors: CustomColors) : ColorScheme() {
-    override val neutral1: ColorSwatch
+class CustomColorPalette(val colors: CustomColors) : ColorPalette() {
+    override val neutral: ColorSwatch
         get() = colorSwatch(colors.neutral1)
-    override val neutral2: ColorSwatch
+    override val neutralVariant: ColorSwatch
         get() = colorSwatch(colors.neutral2)
-    override val accent1: ColorSwatch
+    override val primary: ColorSwatch
         get() = colorSwatch(colors.accent1)
-    override val accent2: ColorSwatch
+    override val secondary: ColorSwatch
         get() = colorSwatch(colors.accent2)
-    override val accent3: ColorSwatch
+    override val tertiary: ColorSwatch
         get() = colorSwatch(colors.accent3)
 
 }

ui/src/main/java/de/mm20/launcher2/ui/theme/colors/DefaultColorPalette.kt

@@ -0,0 +1,18 @@
+package de.mm20.launcher2.ui.theme.colors
+
+import androidx.compose.ui.graphics.Color
+
+
+class DefaultColorPalette: ColorPalette() {
+
+    override val neutral = colorSwatch(Color.Black)
+
+    override val neutralVariant = neutral
+
+    override val primary = colorSwatch(Color(0xFF39A0ED))
+
+    override val secondary = colorSwatch(Color(0xFF4C6085))
+
+    override val tertiary = colorSwatch(Color(0xFFF59CA9))
+
+}

ui/src/main/java/de/mm20/launcher2/ui/theme/colors/DefaultColorScheme.kt

@@ -1,18 +0,0 @@
-package de.mm20.launcher2.ui.theme.colors
-
-import androidx.compose.ui.graphics.Color
-
-
-class DefaultColorScheme: ColorScheme() {
-
-    override val neutral1 = colorSwatch(Color.Black)
-
-    override val neutral2 = neutral1
-
-    override val accent1 = colorSwatch(Color(0xFF39A0ED))
-
-    override val accent2 = colorSwatch(Color(0xFF4C6085))
-
-    override val accent3 = colorSwatch(Color(0xFFF59CA9))
-
-}

ui/src/main/java/de/mm20/launcher2/ui/theme/colors/MM20ColorPalette.kt

@@ -0,0 +1,11 @@
+package de.mm20.launcher2.ui.theme.colors
+
+import androidx.compose.ui.graphics.Color
+
+class MM20ColorPalette: ColorPalette() {
+    override val neutral = colorSwatch(Color(0xff233139))
+    override val neutralVariant = colorSwatch(Color(0xff233139))
+    override val primary = colorSwatch(Color(0xfface330))
+    override val secondary = colorSwatch(Color(0xff496777))
+    override val tertiary = colorSwatch(Color(0xfface330))
+}

ui/src/main/java/de/mm20/launcher2/ui/theme/colors/MM20ColorScheme.kt

@@ -1,11 +0,0 @@
-package de.mm20.launcher2.ui.theme.colors
-
-import androidx.compose.ui.graphics.Color
-
-class MM20ColorScheme: ColorScheme() {
-    override val neutral1 = colorSwatch(Color(0xff233139))
-    override val neutral2 = colorSwatch(Color(0xff233139))
-    override val accent1 = colorSwatch(Color(0xfface330))
-    override val accent2 = colorSwatch(Color(0xff496777))
-    override val accent3 = colorSwatch(Color(0xfface330))
-}

ui/src/main/java/de/mm20/launcher2/ui/theme/colors/SystemColorPalette.kt

@@ -0,0 +1,89 @@
+package de.mm20.launcher2.ui.theme.colors
+
+import android.content.Context
+import android.os.Build
+import androidx.annotation.RequiresApi
+import androidx.compose.ui.graphics.Color
+
+@RequiresApi(api = Build.VERSION_CODES.S)
+class SystemColorPalette(context: Context) : ColorPalette() {
+    override val neutral = ColorSwatch(
+        shade100 = Color(context.getColor(android.R.color.system_neutral1_0)),
+        shade99 = Color(context.getColor(android.R.color.system_neutral1_10)),
+        shade95 = Color(context.getColor(android.R.color.system_neutral1_50)),
+        shade90 = Color(context.getColor(android.R.color.system_neutral1_100)),
+        shade80 = Color(context.getColor(android.R.color.system_neutral1_200)),
+        shade70 = Color(context.getColor(android.R.color.system_neutral1_300)),
+        shade60 = Color(context.getColor(android.R.color.system_neutral1_400)),
+        shade50 = Color(context.getColor(android.R.color.system_neutral1_500)),
+        shade40 = Color(context.getColor(android.R.color.system_neutral1_600)),
+        shade30 = Color(context.getColor(android.R.color.system_neutral1_700)),
+        shade20 = Color(context.getColor(android.R.color.system_neutral1_800)),
+        shade10 = Color(context.getColor(android.R.color.system_neutral1_900)),
+        shade0 = Color(context.getColor(android.R.color.system_neutral1_1000)),
+    )
+
+    override val neutralVariant = ColorSwatch(
+        shade100 = Color(context.getColor(android.R.color.system_neutral2_0)),
+        shade99 = Color(context.getColor(android.R.color.system_neutral2_10)),
+        shade95 = Color(context.getColor(android.R.color.system_neutral2_50)),
+        shade90 = Color(context.getColor(android.R.color.system_neutral2_100)),
+        shade80 = Color(context.getColor(android.R.color.system_neutral2_200)),
+        shade70 = Color(context.getColor(android.R.color.system_neutral2_300)),
+        shade60 = Color(context.getColor(android.R.color.system_neutral2_400)),
+        shade50 = Color(context.getColor(android.R.color.system_neutral2_500)),
+        shade40 = Color(context.getColor(android.R.color.system_neutral2_600)),
+        shade30 = Color(context.getColor(android.R.color.system_neutral2_700)),
+        shade20 = Color(context.getColor(android.R.color.system_neutral2_800)),
+        shade10 = Color(context.getColor(android.R.color.system_neutral2_900)),
+        shade0 = Color(context.getColor(android.R.color.system_neutral2_1000)),
+    )
+
+    override val primary = ColorSwatch(
+        shade100 = Color(context.getColor(android.R.color.system_accent1_0)),
+        shade99 = Color(context.getColor(android.R.color.system_accent1_10)),
+        shade95 = Color(context.getColor(android.R.color.system_accent1_50)),
+        shade90 = Color(context.getColor(android.R.color.system_accent1_100)),
+        shade80 = Color(context.getColor(android.R.color.system_accent1_200)),
+        shade70 = Color(context.getColor(android.R.color.system_accent1_300)),
+        shade60 = Color(context.getColor(android.R.color.system_accent1_400)),
+        shade50 = Color(context.getColor(android.R.color.system_accent1_500)),
+        shade40 = Color(context.getColor(android.R.color.system_accent1_600)),
+        shade30 = Color(context.getColor(android.R.color.system_accent1_700)),
+        shade20 = Color(context.getColor(android.R.color.system_accent1_800)),
+        shade10 = Color(context.getColor(android.R.color.system_accent1_900)),
+        shade0 = Color(context.getColor(android.R.color.system_accent1_1000)),
+    )
+
+    override val secondary = ColorSwatch(
+        shade100 = Color(context.getColor(android.R.color.system_accent2_0)),
+        shade99 = Color(context.getColor(android.R.color.system_accent2_10)),
+        shade95 = Color(context.getColor(android.R.color.system_accent2_50)),
+        shade90 = Color(context.getColor(android.R.color.system_accent2_100)),
+        shade80 = Color(context.getColor(android.R.color.system_accent2_200)),
+        shade70 = Color(context.getColor(android.R.color.system_accent2_300)),
+        shade60 = Color(context.getColor(android.R.color.system_accent2_400)),
+        shade50 = Color(context.getColor(android.R.color.system_accent2_500)),
+        shade40 = Color(context.getColor(android.R.color.system_accent2_600)),
+        shade30 = Color(context.getColor(android.R.color.system_accent2_700)),
+        shade20 = Color(context.getColor(android.R.color.system_accent2_800)),
+        shade10 = Color(context.getColor(android.R.color.system_accent2_900)),
+        shade0 = Color(context.getColor(android.R.color.system_accent2_1000)),
+    )
+
+    override val tertiary = ColorSwatch(
+        shade100 = Color(context.getColor(android.R.color.system_accent3_0)),
+        shade99 = Color(context.getColor(android.R.color.system_accent3_10)),
+        shade95 = Color(context.getColor(android.R.color.system_accent3_50)),
+        shade90 = Color(context.getColor(android.R.color.system_accent3_100)),
+        shade80 = Color(context.getColor(android.R.color.system_accent3_200)),
+        shade70 = Color(context.getColor(android.R.color.system_accent3_300)),
+        shade60 = Color(context.getColor(android.R.color.system_accent3_400)),
+        shade50 = Color(context.getColor(android.R.color.system_accent3_500)),
+        shade40 = Color(context.getColor(android.R.color.system_accent3_600)),
+        shade30 = Color(context.getColor(android.R.color.system_accent3_700)),
+        shade20 = Color(context.getColor(android.R.color.system_accent3_800)),
+        shade10 = Color(context.getColor(android.R.color.system_accent3_900)),
+        shade0 = Color(context.getColor(android.R.color.system_accent3_1000)),
+    )
+}

ui/src/main/java/de/mm20/launcher2/ui/theme/colors/SystemColorScheme.kt

@@ -1,89 +0,0 @@
-package de.mm20.launcher2.ui.theme.colors
-
-import android.content.Context
-import android.os.Build
-import androidx.annotation.RequiresApi
-import androidx.compose.ui.graphics.Color
-
-@RequiresApi(api = Build.VERSION_CODES.S)
-class SystemColorScheme(context: Context) : ColorScheme() {
-    override val neutral1 = ColorSwatch(
-        shade0 = Color(context.getColor(android.R.color.system_neutral1_0)),
-        shade10 = Color(context.getColor(android.R.color.system_neutral1_10)),
-        shade50 = Color(context.getColor(android.R.color.system_neutral1_50)),
-        shade100 = Color(context.getColor(android.R.color.system_neutral1_100)),
-        shade200 = Color(context.getColor(android.R.color.system_neutral1_200)),
-        shade300 = Color(context.getColor(android.R.color.system_neutral1_300)),
-        shade400 = Color(context.getColor(android.R.color.system_neutral1_400)),
-        shade500 = Color(context.getColor(android.R.color.system_neutral1_500)),
-        shade600 = Color(context.getColor(android.R.color.system_neutral1_600)),
-        shade700 = Color(context.getColor(android.R.color.system_neutral1_700)),
-        shade800 = Color(context.getColor(android.R.color.system_neutral1_800)),
-        shade900 = Color(context.getColor(android.R.color.system_neutral1_900)),
-        shade1000 = Color(context.getColor(android.R.color.system_neutral1_1000)),
-    )
-
-    override val neutral2 = ColorSwatch(
-        shade0 = Color(context.getColor(android.R.color.system_neutral2_0)),
-        shade10 = Color(context.getColor(android.R.color.system_neutral2_10)),
-        shade50 = Color(context.getColor(android.R.color.system_neutral2_50)),
-        shade100 = Color(context.getColor(android.R.color.system_neutral2_100)),
-        shade200 = Color(context.getColor(android.R.color.system_neutral2_200)),
-        shade300 = Color(context.getColor(android.R.color.system_neutral2_300)),
-        shade400 = Color(context.getColor(android.R.color.system_neutral2_400)),
-        shade500 = Color(context.getColor(android.R.color.system_neutral2_500)),
-        shade600 = Color(context.getColor(android.R.color.system_neutral2_600)),
-        shade700 = Color(context.getColor(android.R.color.system_neutral2_700)),
-        shade800 = Color(context.getColor(android.R.color.system_neutral2_800)),
-        shade900 = Color(context.getColor(android.R.color.system_neutral2_900)),
-        shade1000 = Color(context.getColor(android.R.color.system_neutral2_1000)),
-    )
-
-    override val accent1 = ColorSwatch(
-        shade0 = Color(context.getColor(android.R.color.system_accent1_0)),
-        shade10 = Color(context.getColor(android.R.color.system_accent1_10)),
-        shade50 = Color(context.getColor(android.R.color.system_accent1_50)),
-        shade100 = Color(context.getColor(android.R.color.system_accent1_100)),
-        shade200 = Color(context.getColor(android.R.color.system_accent1_200)),
-        shade300 = Color(context.getColor(android.R.color.system_accent1_300)),
-        shade400 = Color(context.getColor(android.R.color.system_accent1_400)),
-        shade500 = Color(context.getColor(android.R.color.system_accent1_500)),
-        shade600 = Color(context.getColor(android.R.color.system_accent1_600)),
-        shade700 = Color(context.getColor(android.R.color.system_accent1_700)),
-        shade800 = Color(context.getColor(android.R.color.system_accent1_800)),
-        shade900 = Color(context.getColor(android.R.color.system_accent1_900)),
-        shade1000 = Color(context.getColor(android.R.color.system_accent1_1000)),
-    )
-
-    override val accent2 = ColorSwatch(
-        shade0 = Color(context.getColor(android.R.color.system_accent2_0)),
-        shade10 = Color(context.getColor(android.R.color.system_accent2_10)),
-        shade50 = Color(context.getColor(android.R.color.system_accent2_50)),
-        shade100 = Color(context.getColor(android.R.color.system_accent2_100)),
-        shade200 = Color(context.getColor(android.R.color.system_accent2_200)),
-        shade300 = Color(context.getColor(android.R.color.system_accent2_300)),
-        shade400 = Color(context.getColor(android.R.color.system_accent2_400)),
-        shade500 = Color(context.getColor(android.R.color.system_accent2_500)),
-        shade600 = Color(context.getColor(android.R.color.system_accent2_600)),
-        shade700 = Color(context.getColor(android.R.color.system_accent2_700)),
-        shade800 = Color(context.getColor(android.R.color.system_accent2_800)),
-        shade900 = Color(context.getColor(android.R.color.system_accent2_900)),
-        shade1000 = Color(context.getColor(android.R.color.system_accent2_1000)),
-    )
-
-    override val accent3 = ColorSwatch(
-        shade0 = Color(context.getColor(android.R.color.system_accent3_0)),
-        shade10 = Color(context.getColor(android.R.color.system_accent3_10)),
-        shade50 = Color(context.getColor(android.R.color.system_accent3_50)),
-        shade100 = Color(context.getColor(android.R.color.system_accent3_100)),
-        shade200 = Color(context.getColor(android.R.color.system_accent3_200)),
-        shade300 = Color(context.getColor(android.R.color.system_accent3_300)),
-        shade400 = Color(context.getColor(android.R.color.system_accent3_400)),
-        shade500 = Color(context.getColor(android.R.color.system_accent3_500)),
-        shade600 = Color(context.getColor(android.R.color.system_accent3_600)),
-        shade700 = Color(context.getColor(android.R.color.system_accent3_700)),
-        shade800 = Color(context.getColor(android.R.color.system_accent3_800)),
-        shade900 = Color(context.getColor(android.R.color.system_accent3_900)),
-        shade1000 = Color(context.getColor(android.R.color.system_accent3_1000)),
-    )
-}

ui/src/main/java/de/mm20/launcher2/ui/theme/colors/WallpaperColorPalette.kt

@@ -5,14 +5,14 @@ import androidx.compose.ui.graphics.toArgb
 import androidx.core.graphics.ColorUtils
 import de.mm20.launcher2.ui.theme.WallpaperColors
 
-class WallpaperColorScheme(
+class WallpaperColorPalette(
     wallpaperColors: WallpaperColors
-) : ColorScheme() {
-    override val neutral1: ColorSwatch
-    override val neutral2: ColorSwatch
-    override val accent1: ColorSwatch
-    override val accent2: ColorSwatch
-    override val accent3: ColorSwatch
+) : ColorPalette() {
+    override val neutral: ColorSwatch
+    override val neutralVariant: ColorSwatch
+    override val primary: ColorSwatch
+    override val secondary: ColorSwatch
+    override val tertiary: ColorSwatch
 
     init {
         val primary = wallpaperColors.primary
@@ -35,11 +35,11 @@ class WallpaperColorScheme(
             ?: primary
 
 
-        neutral1 = colorSwatch(neutral)
-        neutral2 = neutral1
-        accent1 = colorSwatch(acc1)
-        accent2 = colorSwatch(acc2)
-        accent3 = neutral1
+        this.neutral = colorSwatch(neutral)
+        neutralVariant = this.neutral
+        this.primary = colorSwatch(acc1)
+        this.secondary = colorSwatch(acc2)
+        this.tertiary = this.neutral
     }
 
     private fun isBrown(color: Color): Boolean {

ui/src/main/java/de/mm20/launcher2/ui/weather/AnimatedWeatherIcon.kt

@@ -7,7 +7,9 @@ import androidx.compose.animation.core.*
 import androidx.compose.animation.graphics.ExperimentalAnimationGraphicsApi
 import androidx.compose.animation.graphics.res.animatedVectorResource
 import androidx.compose.foundation.layout.*
-import androidx.compose.material.*
+import androidx.compose.material.DropdownMenu
+import androidx.compose.material.DropdownMenuItem
+import androidx.compose.material3.*
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.rounded.AcUnit
 import androidx.compose.material.icons.rounded.Air
@@ -20,6 +22,7 @@ import androidx.compose.ui.draw.clipToBounds
 import androidx.compose.ui.draw.rotate
 import androidx.compose.ui.draw.scale
 import androidx.compose.ui.geometry.Offset
+import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import de.mm20.launcher2.ui.*
@@ -65,7 +68,7 @@ private fun SunMoon(icon: WeatherIcon, night: Boolean) {
     val transition = updateTransition(targetState = icon, "AnimatedWeatherIcon")
 
     val color by animateColorAsState(
-        if (night) MaterialTheme.colors.weatherMoon else MaterialTheme.colors.weatherSun
+        if (night)colorResource(id = R.color.weather_moon) else colorResource(id = R.color.weather_sun)
     )
     val scale by transition.animateFloat(label = "sunScale") {
         when (it) {
@@ -129,7 +132,7 @@ private fun LightningBolt(icon: WeatherIcon) {
             .size(32.dp)
             .offset(offset.x.dp, offset.y.dp)
             .scale(scale),
-        tint = MaterialTheme.colors.weatherBolt
+        tint = colorResource(id = R.color.weather_lightning_bolt)
     )
 }
 
@@ -159,7 +162,7 @@ private fun LightningBolt2(icon: WeatherIcon) {
             .size(32.dp)
             .offset(offset.x.dp, offset.y.dp)
             .scale(scale),
-        tint = MaterialTheme.colors.weatherBolt
+        tint = colorResource(id = R.color.weather_lightning_bolt)
     )
 }
 
@@ -216,19 +219,19 @@ private fun Cloud1(icon: WeatherIcon) {
             WeatherIcon.ThunderstormWithRain,
             WeatherIcon.HeavyThunderstorm,
             WeatherIcon.HeavyThunderstormWithRain,
-            WeatherIcon.Storm -> MaterialTheme.colors.weatherCloudDark2
+            WeatherIcon.Storm -> colorResource(id = R.color.weather_cloud_dark_2)
             WeatherIcon.Showers,
             WeatherIcon.Sleet,
             WeatherIcon.Hail,
             WeatherIcon.Cloudy,
             WeatherIcon.Wind,
-            WeatherIcon.Fog -> MaterialTheme.colors.weatherCloudDark1
+            WeatherIcon.Fog -> colorResource(id = R.color.weather_cloud_dark_1)
             WeatherIcon.Drizzle,
-            WeatherIcon.Snow -> MaterialTheme.colors.weatherCloudMedium2
-            WeatherIcon.MostlyCloudy -> MaterialTheme.colors.weatherCloudLight2
+            WeatherIcon.Snow -> colorResource(id = R.color.weather_cloud_medium_2)
+            WeatherIcon.MostlyCloudy -> colorResource(id = R.color.weather_cloud_light_2)
             WeatherIcon.PartlyCloudy,
-            WeatherIcon.BrokenClouds -> MaterialTheme.colors.weatherCloudLight1
-            else -> MaterialTheme.colors.weatherCloudMedium2
+            WeatherIcon.BrokenClouds -> colorResource(id = R.color.weather_cloud_light_1)
+            else -> colorResource(id = R.color.weather_cloud_medium_2)
         }
     }
 
@@ -289,12 +292,12 @@ private fun Cloud2(icon: WeatherIcon) {
     }
     val color by transition.animateColor(label = "color") {
         when (it) {
-            WeatherIcon.BrokenClouds -> MaterialTheme.colors.weatherCloudLight2
+            WeatherIcon.BrokenClouds -> colorResource(id = R.color.weather_cloud_light_2)
             WeatherIcon.Thunderstorm,
             WeatherIcon.ThunderstormWithRain,
             WeatherIcon.HeavyThunderstorm,
             WeatherIcon.HeavyThunderstormWithRain,
-            WeatherIcon.Storm -> MaterialTheme.colors.weatherCloudMedium2
+            WeatherIcon.Storm -> colorResource(id = R.color.weather_cloud_medium_2)
             WeatherIcon.Showers,
             WeatherIcon.Drizzle,
             WeatherIcon.Sleet,
@@ -302,9 +305,9 @@ private fun Cloud2(icon: WeatherIcon) {
             WeatherIcon.Hail,
             WeatherIcon.Cloudy,
             WeatherIcon.Wind,
-            WeatherIcon.Fog -> MaterialTheme.colors.weatherCloudMedium1
-            WeatherIcon.MostlyCloudy -> MaterialTheme.colors.weatherCloudMedium1
-            else -> MaterialTheme.colors.weatherCloudMedium2
+            WeatherIcon.Fog -> colorResource(id = R.color.weather_cloud_medium_1)
+            WeatherIcon.MostlyCloudy -> colorResource(id = R.color.weather_cloud_medium_1)
+            else -> colorResource(id = R.color.weather_cloud_medium_2)
         }
     }
 
@@ -363,15 +366,15 @@ private fun Cloud3(icon: WeatherIcon) {
             WeatherIcon.ThunderstormWithRain,
             WeatherIcon.HeavyThunderstorm,
             WeatherIcon.HeavyThunderstormWithRain,
-            WeatherIcon.Storm -> MaterialTheme.colors.weatherCloudDark1
+            WeatherIcon.Storm -> colorResource(id = R.color.weather_cloud_dark_1)
             WeatherIcon.Showers,
             WeatherIcon.Sleet,
             WeatherIcon.Hail,
             WeatherIcon.Cloudy,
-            WeatherIcon.Wind -> MaterialTheme.colors.weatherCloudMedium2
+            WeatherIcon.Wind -> colorResource(id = R.color.weather_cloud_medium_2)
             WeatherIcon.Drizzle,
-            WeatherIcon.Snow -> MaterialTheme.colors.weatherCloudLight2
-            else -> MaterialTheme.colors.weatherCloudMedium2
+            WeatherIcon.Snow -> colorResource(id = R.color.weather_cloud_light_2)
+            else -> colorResource(id = R.color.weather_cloud_medium_2)
         }
     }
 
@@ -401,7 +404,7 @@ private fun Hot(icon: WeatherIcon) {
         modifier = Modifier
             .scale(scale)
             .size(32.dp),
-        tint = MaterialTheme.colors.weatherHot
+        tint = colorResource(id = R.color.weather_hot)
     )
 }
 
@@ -420,7 +423,7 @@ private fun Cold(icon: WeatherIcon) {
         modifier = Modifier
             .scale(scale)
             .size(32.dp),
-        tint = MaterialTheme.colors.weatherCold
+        tint = colorResource(id = R.color.weather_cold)
     )
 }
 
@@ -440,7 +443,7 @@ private fun Wind1(icon: WeatherIcon) {
             .scale(scale)
             .offset(12.dp, 11.dp)
             .size(32.dp),
-        tint = MaterialTheme.colors.weatherWind
+        tint = colorResource(id = R.color.weather_wind)
     )
 }
 
@@ -460,7 +463,7 @@ private fun Wind2(icon: WeatherIcon) {
             .scale(scale)
             .offset(8.dp, -1.dp)
             .size(32.dp),
-        tint = MaterialTheme.colors.weatherWindDark
+        tint = colorResource(id = R.color.weather_wind_dark)
     )
 }
 
@@ -528,7 +531,7 @@ private fun Precipitation(icon: WeatherIcon) {
                             .offset(y = 8.dp + 11.dp * animProgress),
                         imageVector = Icons.Rounded.WeatherLightRainAnimatable,
                         contentDescription = null,
-                        tint = MaterialTheme.colors.weatherRain
+                        tint = colorResource(id = R.color.weather_rain)
                     )
                 }
                 WeatherIcon.Hail -> {
@@ -544,7 +547,7 @@ private fun Precipitation(icon: WeatherIcon) {
                             .offset(y = 8.dp + 11.dp * animProgress),
                         imageVector = Icons.Rounded.WeatherHailAnimatable,
                         contentDescription = null,
-                        tint = MaterialTheme.colors.weatherHail
+                        tint = colorResource(id = R.color.weather_hail)
                     )
                 }
                 WeatherIcon.Snow -> {
@@ -563,7 +566,7 @@ private fun Precipitation(icon: WeatherIcon) {
                             ),
                         imageVector = Icons.Rounded.WeatherHailAnimatable,
                         contentDescription = null,
-                        tint = MaterialTheme.colors.weatherSnow
+                        tint = colorResource(id = R.color.weather_snow)
                     )
                 }
                 WeatherIcon.Showers,
@@ -581,7 +584,7 @@ private fun Precipitation(icon: WeatherIcon) {
                             .offset(y = 8.dp + 11.dp * animProgress),
                         imageVector = Icons.Rounded.WeatherRainAnimatable,
                         contentDescription = null,
-                        tint = MaterialTheme.colors.weatherRain
+                        tint = colorResource(id = R.color.weather_rain)
                     )
                 }
                 WeatherIcon.Sleet -> {
@@ -597,7 +600,7 @@ private fun Precipitation(icon: WeatherIcon) {
                             .offset(y = 8.dp + 11.dp * animProgress),
                         imageVector = Icons.Rounded.WeatherSleetRainAnimatable,
                         contentDescription = null,
-                        tint = MaterialTheme.colors.weatherRain
+                        tint = colorResource(id = R.color.weather_rain)
                     )
                     Icon(
                         modifier = Modifier
@@ -605,7 +608,7 @@ private fun Precipitation(icon: WeatherIcon) {
                             .offset(y = 8.dp + 11.dp * animProgress),
                         imageVector = Icons.Rounded.WeatherSleetSnowAnimatable,
                         contentDescription = null,
-                        tint = MaterialTheme.colors.weatherSnow
+                        tint = colorResource(id = R.color.weather_snow)
                     )
                 }
             }
@@ -624,7 +627,7 @@ private fun Fog(icon: WeatherIcon) {
             .offset(x = 6.dp, y = 7.dp),
         imageVector = Icons.Rounded.WeatherFog,
         contentDescription = null,
-        tint = MaterialTheme.colors.weatherFog
+        tint = colorResource(id = R.color.weather_fog)
     )
 }
 

ui/src/main/java/de/mm20/launcher2/ui/weather/WeatherIcon.kt

@@ -3,8 +3,7 @@ package de.mm20.launcher2.ui.weather
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.offset
 import androidx.compose.foundation.layout.size
-import androidx.compose.material.Icon
-import androidx.compose.material.MaterialTheme
+import androidx.compose.material3.Icon
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.rounded.*
 import androidx.compose.runtime.Composable
@@ -12,6 +11,7 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.scale
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.unit.DpOffset
 import androidx.compose.ui.unit.dp
 import de.mm20.launcher2.ui.*
@@ -51,7 +51,7 @@ private fun SunMoon(icon: WeatherIcon, night: Boolean) {
         else -> return
     }
 
-    val color = if (night) MaterialTheme.colors.weatherMoon else MaterialTheme.colors.weatherSun
+    val color = if (night) colorResource(id = R.color.weather_moon) else colorResource(id = R.color.weather_sun)
 
     val scale = when (icon) {
         WeatherIcon.Clear,
@@ -139,18 +139,18 @@ private fun Cloud1(icon: WeatherIcon) {
         WeatherIcon.Thunderstorm,
         WeatherIcon.ThunderstormWithRain,
         WeatherIcon.HeavyThunderstorm,
-        WeatherIcon.HeavyThunderstormWithRain -> MaterialTheme.colors.weatherCloudDark2
+        WeatherIcon.HeavyThunderstormWithRain -> colorResource(id = R.color.weather_cloud_dark_2)
         WeatherIcon.Showers,
         WeatherIcon.Sleet,
         WeatherIcon.Hail,
         WeatherIcon.Cloudy,
-        WeatherIcon.Fog -> MaterialTheme.colors.weatherCloudDark1
+        WeatherIcon.Fog -> colorResource(id = R.color.weather_cloud_dark_1)
         WeatherIcon.Drizzle,
-        WeatherIcon.Snow -> MaterialTheme.colors.weatherCloudMedium2
-        WeatherIcon.MostlyCloudy -> MaterialTheme.colors.weatherCloudLight2
+        WeatherIcon.Snow -> colorResource(id = R.color.weather_cloud_medium_2)
+        WeatherIcon.MostlyCloudy -> colorResource(id = R.color.weather_cloud_light_2)
         WeatherIcon.PartlyCloudy,
-        WeatherIcon.BrokenClouds -> MaterialTheme.colors.weatherCloudLight1
-        else -> MaterialTheme.colors.weatherCloudMedium2
+        WeatherIcon.BrokenClouds -> colorResource(id = R.color.weather_cloud_light_1)
+        else -> colorResource(id = R.color.weather_cloud_medium_2)
     }
 
     Icon(
@@ -218,20 +218,20 @@ private fun Cloud2(icon: WeatherIcon) {
         else -> DpOffset.Zero
     }
     val color = when (icon) {
-        WeatherIcon.BrokenClouds -> MaterialTheme.colors.weatherCloudLight2
+        WeatherIcon.BrokenClouds -> colorResource(id = R.color.weather_cloud_light_2)
         WeatherIcon.Thunderstorm,
         WeatherIcon.ThunderstormWithRain,
         WeatherIcon.HeavyThunderstorm,
-        WeatherIcon.HeavyThunderstormWithRain -> MaterialTheme.colors.weatherCloudMedium2
+        WeatherIcon.HeavyThunderstormWithRain -> colorResource(id = R.color.weather_cloud_medium_2)
         WeatherIcon.Showers,
         WeatherIcon.Drizzle,
         WeatherIcon.Sleet,
         WeatherIcon.Snow,
         WeatherIcon.Hail,
         WeatherIcon.Cloudy,
-        WeatherIcon.Fog -> MaterialTheme.colors.weatherCloudMedium1
-        WeatherIcon.MostlyCloudy -> MaterialTheme.colors.weatherCloudMedium1
-        else -> MaterialTheme.colors.weatherCloudMedium2
+        WeatherIcon.Fog -> colorResource(id = R.color.weather_cloud_medium_1)
+        WeatherIcon.MostlyCloudy -> colorResource(id = R.color.weather_cloud_medium_1)
+        else -> colorResource(id = R.color.weather_cloud_medium_2)
     }
 
     Icon(
@@ -280,14 +280,14 @@ private fun Cloud3(icon: WeatherIcon) {
         WeatherIcon.Thunderstorm,
         WeatherIcon.ThunderstormWithRain,
         WeatherIcon.HeavyThunderstorm,
-        WeatherIcon.HeavyThunderstormWithRain -> MaterialTheme.colors.weatherCloudDark1
+        WeatherIcon.HeavyThunderstormWithRain -> colorResource(id = R.color.weather_cloud_dark_1)
         WeatherIcon.Showers,
         WeatherIcon.Sleet,
         WeatherIcon.Hail,
-        WeatherIcon.Cloudy -> MaterialTheme.colors.weatherCloudMedium2
+        WeatherIcon.Cloudy -> colorResource(id = R.color.weather_cloud_medium_2)
         WeatherIcon.Drizzle,
-        WeatherIcon.Snow -> MaterialTheme.colors.weatherCloudLight2
-        else -> MaterialTheme.colors.weatherCloudMedium2
+        WeatherIcon.Snow -> colorResource(id = R.color.weather_cloud_light_2)
+        else -> colorResource(id = R.color.weather_cloud_medium_2)
     }
 
     Icon(
@@ -309,7 +309,7 @@ private fun Precipitation(icon: WeatherIcon) {
                 .size(32.dp),
             imageVector = Icons.Rounded.WeatherSleetSnow,
             contentDescription = null,
-            tint = MaterialTheme.colors.weatherSnow
+            tint = colorResource(id = R.color.weather_snow)
         )
         Icon(
             modifier = Modifier
@@ -317,7 +317,7 @@ private fun Precipitation(icon: WeatherIcon) {
                 .size(32.dp),
             imageVector = Icons.Rounded.WeatherSleetRain,
             contentDescription = null,
-            tint = MaterialTheme.colors.weatherRain
+            tint = colorResource(id = R.color.weather_rain)
         )
         return
     }
@@ -344,9 +344,9 @@ private fun Precipitation(icon: WeatherIcon) {
         WeatherIcon.Drizzle,
         WeatherIcon.Showers,
         WeatherIcon.ThunderstormWithRain,
-        WeatherIcon.HeavyThunderstormWithRain -> MaterialTheme.colors.weatherRain
-        WeatherIcon.Hail -> MaterialTheme.colors.weatherHail
-        WeatherIcon.Snow -> MaterialTheme.colors.weatherSnow
+        WeatherIcon.HeavyThunderstormWithRain -> colorResource(id = R.color.weather_rain)
+        WeatherIcon.Hail -> colorResource(id = R.color.weather_hail)
+        WeatherIcon.Snow -> colorResource(id = R.color.weather_snow)
         else -> Color.Unspecified
     }
     Icon(
@@ -367,7 +367,7 @@ private fun HotCold(icon: WeatherIcon) {
                 .size(32.dp),
             imageVector = Icons.Rounded.Thermostat,
             contentDescription = null,
-            tint = MaterialTheme.colors.weatherHot
+            tint = colorResource(id = R.color.weather_hot)
         )
     }
     if (icon == WeatherIcon.Cold) {
@@ -376,7 +376,7 @@ private fun HotCold(icon: WeatherIcon) {
                 .size(32.dp),
             imageVector = Icons.Rounded.AcUnit,
             contentDescription = null,
-            tint = MaterialTheme.colors.weatherCold
+            tint = colorResource(id = R.color.weather_cold)
         )
     }
 }
@@ -390,7 +390,7 @@ private fun Wind(icon: WeatherIcon) {
                 .size(24.dp),
             imageVector = Icons.Rounded.Air,
             contentDescription = null,
-            tint = MaterialTheme.colors.weatherWindDark
+            tint = colorResource(id = R.color.weather_wind_dark)
         )
     }
     if (icon == WeatherIcon.Wind || icon == WeatherIcon.Storm) {
@@ -399,7 +399,7 @@ private fun Wind(icon: WeatherIcon) {
                 .size(if(icon == WeatherIcon.Wind) 32.dp else 24.dp),
             imageVector = Icons.Rounded.Air,
             contentDescription = null,
-            tint = MaterialTheme.colors.weatherWind
+            tint = colorResource(id = R.color.weather_wind)
         )
     }
 }
@@ -417,7 +417,7 @@ private fun Fog(icon: WeatherIcon) {
             .offset(x = 3.dp, y = 4.dp),
         imageVector = Icons.Rounded.WeatherFog,
         contentDescription = null,
-        tint = MaterialTheme.colors.weatherFog
+        tint = colorResource(id = R.color.weather_fog)
     )
 }
 
@@ -440,7 +440,7 @@ private fun LightningBolts(icon: WeatherIcon) {
             .offset(x = if (isHeavy) 4.dp else 1.dp, y = 6.dp),
         imageVector = Icons.Rounded.Bolt,
         contentDescription = null,
-        tint = MaterialTheme.colors.weatherBolt
+        tint = colorResource(id = R.color.weather_lightning_bolt)
     )
 
     if  (icon == WeatherIcon.HeavyThunderstorm || icon == WeatherIcon.HeavyThunderstormWithRain) {
@@ -450,7 +450,7 @@ private fun LightningBolts(icon: WeatherIcon) {
                 .offset(x = -3.dp, y = 6.dp),
             imageVector = Icons.Rounded.Bolt,
             contentDescription = null,
-            tint = MaterialTheme.colors.weatherBolt
+            tint = colorResource(id = R.color.weather_lightning_bolt)
         )
     }
 }

ui/src/main/java/de/mm20/launcher2/ui/widget/CalendarWidget.kt

@@ -7,7 +7,9 @@ import android.widget.FrameLayout
 import androidx.compose.animation.animateContentSize
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.*
-import androidx.compose.material.*
+import androidx.compose.material.DropdownMenu
+import androidx.compose.material.DropdownMenuItem
+import androidx.compose.material3.*
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.rounded.*
 import androidx.compose.runtime.*
@@ -123,7 +125,7 @@ fun CalendarWidget() {
             if (pinnedEvents.isNotEmpty()) {
                 Text(
                     text = stringResource(id = R.string.calendar_widget_pinned_events),
-                    style = MaterialTheme.typography.subtitle1
+                    style = MaterialTheme.typography.titleLarge
                 )
                 DeprecatedSearchableList(
                     items = pinnedEvents,
@@ -179,7 +181,7 @@ fun DaySelector(
                     modifier = Modifier
                         .wrapContentWidth(),
                     text = formatDay(LocalContext.current, selectedDay),
-                    style = MaterialTheme.typography.subtitle1
+                    style = MaterialTheme.typography.titleLarge
                 )
                 Icon(
                     imageVector = Icons.Rounded.ArrowDropDown,
@@ -199,7 +201,7 @@ fun DaySelector(
                     }) {
                         Text(
                             text = formatDay(LocalContext.current, day),
-                            style = MaterialTheme.typography.subtitle2
+                            style = MaterialTheme.typography.titleMedium
                         )
                     }
                 }
@@ -245,7 +247,7 @@ object CalendarWidgetShim {
         composeView.id = FrameLayout.generateViewId()
         composeView.setContent {
             LauncherTheme {
-                CompositionLocalProvider(LocalContentColor provides MaterialTheme.colors.onSurface) {
+                CompositionLocalProvider(LocalContentColor provides MaterialTheme.colorScheme.onSurface) {
                     Column {
                         CalendarWidget()
                     }

ui/src/main/java/de/mm20/launcher2/ui/widget/ClockWidget.kt

@@ -6,8 +6,8 @@ import android.content.Intent
 import android.content.IntentFilter
 import androidx.compose.animation.animateColorAsState
 import androidx.compose.foundation.layout.*
-import androidx.compose.material.LocalContentColor
-import androidx.compose.material.MaterialTheme
+import androidx.compose.material3.LocalContentColor
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.*
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -39,7 +39,7 @@ fun ClockWidget(
         contentAlignment = Alignment.BottomCenter
     ) {
         val contentColor by animateColorAsState(
-            if (transparentBackground) Color.White else MaterialTheme.colors.onSurface
+            if (transparentBackground) Color.White else MaterialTheme.colorScheme.onSurface
         )
 
         CompositionLocalProvider(LocalContentColor provides contentColor) {

ui/src/main/java/de/mm20/launcher2/ui/widget/MusicWidget.kt

@@ -7,10 +7,10 @@ import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
 import androidx.compose.foundation.combinedClickable
 import androidx.compose.foundation.layout.*
-import androidx.compose.material.Icon
-import androidx.compose.material.IconButton
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.Text
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Text
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.rounded.MusicNote
 import androidx.compose.material.icons.rounded.SkipNext
@@ -65,20 +65,20 @@ fun MusicWidget() {
                 ) {
                     Text(
                         text = title ?: "---",
-                        style = MaterialTheme.typography.subtitle1,
+                        style = MaterialTheme.typography.titleMedium,
                         maxLines = 1,
                         overflow = TextOverflow.Ellipsis
                     )
                     Text(
                         text = artist ?: "---",
                         modifier = Modifier.padding(vertical = 2.dp),
-                        style = MaterialTheme.typography.body1,
+                        style = MaterialTheme.typography.bodySmall,
                         maxLines = 1,
                         overflow = TextOverflow.Ellipsis
                     )
                     Text(
                         text = album ?: "---",
-                        style = MaterialTheme.typography.body1,
+                        style = MaterialTheme.typography.bodySmall,
                         maxLines = 1,
                         overflow = TextOverflow.Ellipsis
                     )
@@ -131,7 +131,7 @@ fun MusicWidget() {
                     .conditional(
                         albumArt == null,
                         Modifier.background(
-                            LocalColorScheme.current.accent1.shade200
+                            LocalColorScheme.current.primary.shade80
                         )
                     ),
                 contentAlignment = Alignment.Center
@@ -149,7 +149,7 @@ fun MusicWidget() {
                     Icon(
                         imageVector = Icons.Rounded.MusicNote,
                         contentDescription = null,
-                        tint = LocalColorScheme.current.accent1.shade600,
+                        tint = LocalColorScheme.current.primary.shade40,
                         modifier = Modifier.size(56.dp)
                     )
                 }

ui/src/main/java/de/mm20/launcher2/ui/widget/PlatformWidget.kt

@@ -4,7 +4,7 @@ import android.appwidget.AppWidgetManager
 import android.os.Build
 import android.view.ViewGroup
 import android.widget.FrameLayout
-import androidx.compose.material.MaterialTheme
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.remember
 import androidx.compose.ui.platform.LocalContext
@@ -26,7 +26,7 @@ fun PlatformWidget(widget: Widget) {
     }
 
     val height = widget.height.dp.toPixels().toInt()
-    val isLightTheme = MaterialTheme.colors.isLight
+    val isLightTheme = androidx.compose.material.MaterialTheme.colors.isLight
 
     AndroidView(
         factory = {

ui/src/main/java/de/mm20/launcher2/ui/widget/WeatherWidget.kt

@@ -4,28 +4,25 @@ import android.content.Context
 import android.content.Intent
 import android.net.Uri
 import android.text.format.DateUtils
-import android.view.View
-import android.widget.FrameLayout
 import androidx.compose.animation.AnimatedVisibility
 import androidx.compose.animation.ExperimentalAnimationApi
-import androidx.compose.foundation.Image
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.*
+import androidx.compose.material.ContentAlpha
+import androidx.compose.material.DropdownMenu
+import androidx.compose.material.DropdownMenuItem
+import androidx.compose.material.LocalContentAlpha
 import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.ArrowDropDown
 import androidx.compose.material.icons.rounded.ArrowDropDown
+import androidx.compose.material3.*
 import androidx.compose.runtime.*
 import androidx.compose.runtime.livedata.observeAsState
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.platform.ComposeView
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.colorResource
-import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.res.vectorResource
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.DpOffset
@@ -34,10 +31,7 @@ import androidx.compose.ui.unit.sp
 import androidx.lifecycle.viewmodel.compose.viewModel
 import de.mm20.launcher2.ktx.tryStartActivity
 import de.mm20.launcher2.preferences.LauncherPreferences
-import de.mm20.launcher2.ui.LauncherTheme
-import de.mm20.launcher2.ui.LegacyLauncherTheme
 import de.mm20.launcher2.ui.R
-import de.mm20.launcher2.ui.legacyTypography
 import de.mm20.launcher2.ui.weather.AnimatedWeatherIcon
 import de.mm20.launcher2.ui.weather.WeatherIcon
 import de.mm20.launcher2.weather.DailyForecast
@@ -81,7 +75,7 @@ fun WeatherWidget() {
             ) {
                 Text(
                     text = selectedForecast.location,
-                    style = MaterialTheme.typography.subtitle1
+                    style = MaterialTheme.typography.titleMedium
                 )
                 Text(
                     text = convertTemperature(
@@ -96,7 +90,7 @@ fun WeatherWidget() {
                 )
                 Text(
                     text = selectedForecast.condition,
-                    style = MaterialTheme.typography.body1
+                    style = MaterialTheme.typography.bodySmall
                 )
 
                 Row(
@@ -107,7 +101,7 @@ fun WeatherWidget() {
                         .padding(vertical = 12.dp)
                 ) {
                     CompositionLocalProvider(LocalContentAlpha provides ContentAlpha.medium) {
-                        Text(text = stringResource(id = if (detailsExpanded) R.string.weather_widget_hide_details else R.string.weather_widget_show_details))
+                        Text(text = stringResource(id = if (detailsExpanded) R.string.weather_widget_hide_details else R.string.weather_widget_show_details), style = MaterialTheme.typography.bodySmall)
                     }
                 }
 
@@ -146,7 +140,7 @@ fun WeatherWidget() {
                 Spacer(modifier = Modifier.weight(1f))
                 Surface(
                     shape = RoundedCornerShape(topStartPercent = 50, bottomStartPercent = 50),
-                    color = MaterialTheme.colors.onSurface.copy(alpha = 0.12f),
+                    color = MaterialTheme.colorScheme.onSurface.copy(alpha = 0.12f),
                     modifier = Modifier.align(Alignment.End)
 
                 ) {
@@ -207,11 +201,11 @@ fun WeatherDetailRow(title: String, value: String) {
             Text(
                 text = title,
                 modifier = Modifier.padding(end = 8.dp),
-                style = MaterialTheme.typography.body2,
+                style = MaterialTheme.typography.bodySmall,
             )
             Text(
                 text = value,
-                style = MaterialTheme.typography.body2,
+                style = MaterialTheme.typography.bodySmall,
             )
         }
     }
@@ -241,7 +235,7 @@ fun WeatherDaySelector(
             CompositionLocalProvider(LocalContentAlpha provides ContentAlpha.high) {
                 Text(
                     text = dateFormat.format(selectedDay.timestamp),
-                    style = MaterialTheme.typography.subtitle2,
+                    style = MaterialTheme.typography.labelSmall,
                     modifier = Modifier
                         .align(Alignment.CenterVertically)
                         .padding(start = 16.dp, end = 8.dp)
@@ -253,7 +247,7 @@ fun WeatherDaySelector(
                             selectedDay.minTemp
                         )
                     }° / ${convertTemperature(imperialUnits, selectedDay.maxTemp)}°",
-                    style = MaterialTheme.typography.body2,
+                    style = MaterialTheme.typography.bodySmall,
                     modifier = Modifier.align(Alignment.CenterVertically)
                 )
                 Icon(
@@ -281,7 +275,7 @@ fun WeatherDaySelector(
                         CompositionLocalProvider(LocalContentAlpha provides ContentAlpha.high) {
                             Text(
                                 text = dateFormat.format(d.timestamp),
-                                style = MaterialTheme.typography.subtitle2,
+                                style = MaterialTheme.typography.labelSmall,
                                 softWrap = false,
                                 modifier = Modifier
                                     .align(Alignment.CenterVertically)
@@ -296,7 +290,7 @@ fun WeatherDaySelector(
                                     )
                                 }° / ${convertTemperature(imperialUnits, d.maxTemp)}°",
                                 softWrap = false,
-                                style = MaterialTheme.typography.body2,
+                                style = MaterialTheme.typography.bodySmall,
                                 modifier = Modifier.align(Alignment.CenterVertically)
                             )
                         }
@@ -332,7 +326,7 @@ fun WeatherTimeSelector(
             CompositionLocalProvider(LocalContentAlpha provides ContentAlpha.high) {
                 Text(
                     text = dateFormat.format(selectedForecast.timestamp),
-                    style = MaterialTheme.typography.subtitle2,
+                    style = MaterialTheme.typography.titleSmall,
                     modifier = Modifier.align(Alignment.CenterVertically)
                 )
             }
@@ -358,7 +352,7 @@ fun WeatherTimeSelector(
                         CompositionLocalProvider(LocalContentAlpha provides ContentAlpha.high) {
                             Text(
                                 text = dateFormat.format(fc.timestamp),
-                                style = MaterialTheme.typography.subtitle2,
+                                style = MaterialTheme.typography.titleSmall,
                                 softWrap = false,
                                 modifier = Modifier
                                     .align(Alignment.CenterVertically)
@@ -370,7 +364,7 @@ fun WeatherTimeSelector(
                             Text(
                                 text = "${convertTemperature(imperialUnits, fc.temperature)}°",
                                 softWrap = false,
-                                style = MaterialTheme.typography.body2,
+                                style = MaterialTheme.typography.bodySmall,
                                 modifier = Modifier.align(Alignment.CenterVertically)
                             )
                         }

ui/src/main/java/de/mm20/launcher2/ui/widget/parts/DatePart.kt

@@ -1,7 +1,7 @@
 package de.mm20.launcher2.ui.widget.parts
 
 import android.text.format.DateUtils
-import androidx.compose.material.MaterialTheme
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import de.mm20.launcher2.ui.component.TextClock
 
@@ -9,6 +9,6 @@ import de.mm20.launcher2.ui.component.TextClock
 fun DatePart() {
     TextClock(
         formatFlags = DateUtils.FORMAT_SHOW_WEEKDAY or DateUtils.FORMAT_SHOW_DATE or DateUtils.FORMAT_SHOW_YEAR,
-        style = MaterialTheme.typography.subtitle1
+        style = MaterialTheme.typography.titleMedium
     )
 }

ui/src/main/res/layout/activity_launcher.xml

@@ -126,6 +126,7 @@
                     android:animateLayoutChanges="true"
                     android:clipChildren="false"
                     android:clipToPadding="false"
+                    android:paddingTop="8dp"
                     android:orientation="vertical">
 
                     <de.mm20.launcher2.view.ElevationImageView
@@ -163,10 +164,7 @@
                         android:layout_marginTop="8dp"
                         android:layout_marginBottom="16dp"
                         android:text="@string/menu_edit_widgets"
-                        android:textColor="@color/text_color_primary"
-                        app:backgroundTint="?colorSurface"
-                        app:icon="@drawable/ic_edit"
-                        app:iconTint="@color/text_color_primary" />
+                        app:icon="@drawable/ic_edit" />
 
                 </LinearLayout>
             </LinearLayout>
@@ -185,10 +183,10 @@
             android:id="@+id/editWidgetToolbar"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            android:background="?colorSurface"
             android:elevation="4dp"
             android:translationY="-56dp"
             android:visibility="gone"
+            style="@style/Widget.Material3.Toolbar.Surface"
             app:title="@string/menu_edit_widgets" />
     </FrameLayout>
 

ui/src/main/res/values-night/weather_colors.xml

@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <color name="weather_sun">@color/amber</color>
+    <color name="weather_moon">#E0E0E0</color>
+    <color name="weather_cloud_light_1">#ECEFF1</color>
+    <color name="weather_cloud_light_2">#CFD8DC</color>
+    <color name="weather_cloud_medium_1">#78909C</color>
+    <color name="weather_cloud_medium_2">#607D8B</color>
+    <color name="weather_cloud_dark_1">#546E7A</color>
+    <color name="weather_cloud_dark_2">#455A64</color>
+    <color name="weather_snow">#F5F5F5</color>
+    <color name="weather_rain">@color/blue</color>
+    <color name="weather_hail">#E3F2FD</color>
+    <color name="weather_hot">@color/red</color>
+    <color name="weather_cold">@color/lightblue</color>
+    <color name="weather_wind">#CFD8DC</color>
+    <color name="weather_wind_dark">#78909C</color>
+    <color name="weather_fog">@color/weather_cloud_light_2</color>
+    <color name="weather_lightning_bolt">@color/amber</color>
+</resources>

ui/src/main/res/values/weather_colors.xml

@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <color name="weather_sun">@color/amber</color>
+    <color name="weather_moon">#9E9E9E</color>
+    <color name="weather_cloud_light_1">#ECEFF1</color>
+    <color name="weather_cloud_light_2">#90A4AE</color>
+    <color name="weather_cloud_medium_1">#546E7A</color>
+    <color name="weather_cloud_medium_2">#455a64</color>
+    <color name="weather_cloud_dark_1">#37474F</color>
+    <color name="weather_cloud_dark_2">#263238</color>
+    <color name="weather_snow">#E0E0E0</color>
+    <color name="weather_rain">@color/blue</color>
+    <color name="weather_hail">#BBDEFB</color>
+    <color name="weather_hot">@color/red</color>
+    <color name="weather_cold">@color/lightblue</color>
+    <color name="weather_wind">#90A4AE</color>
+    <color name="weather_wind_dark">#546E7A</color>
+    <color name="weather_fog">@color/weather_cloud_light_2</color>
+    <color name="weather_lightning_bolt">@color/amber</color>
+</resources>