diff --git a/app/src/main/java/com/hippo/ehviewer/client/EhUtils.kt b/app/src/main/java/com/hippo/ehviewer/client/EhUtils.kt
index 945ed2065..8bd3f48e1 100644
--- a/app/src/main/java/com/hippo/ehviewer/client/EhUtils.kt
+++ b/app/src/main/java/com/hippo/ehviewer/client/EhUtils.kt
@@ -15,10 +15,15 @@
  */
 package com.hippo.ehviewer.client
 
+import android.annotation.SuppressLint
 import android.content.Context
 import androidx.compose.runtime.Composable
+import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.platform.LocalContext
+import com.google.android.material.R
 import com.google.android.material.color.MaterialColors
+import com.google.android.material.color.utilities.Hct
+import com.google.android.material.color.utilities.MathUtils
 import com.hippo.ehviewer.Settings
 import com.hippo.ehviewer.client.data.GalleryInfo
 import java.util.regex.Pattern
@@ -96,6 +101,17 @@ object EhUtils {
         return CATEGORY_VALUES.getOrDefault(type, CATEGORY_VALUES[UNKNOWN])!![0]
     }
 
+    @SuppressLint("RestrictedApi")
+    fun harmonizeWithRole(context: Context, src: Int): Int {
+        val primary = MaterialColors.getColor(context, R.attr.colorPrimaryContainer, "EhUtils")
+        val fromHct = Hct.fromInt(src)
+        val toHct = Hct.fromInt(primary)
+        val differenceDegrees = MathUtils.differenceDegrees(fromHct.hue, toHct.hue)
+        val rotationDegrees = minOf(differenceDegrees * 0.5, 15.0)
+        val outputHue = MathUtils.sanitizeDegreesDouble(fromHct.hue + rotationDegrees * MathUtils.rotationDirection(fromHct.hue, toHct.hue))
+        return Hct.from(outputHue, toHct.chroma, toHct.tone).toInt()
+    }
+
     fun getCategoryColor(context: Context, category: Int): Int {
         val primary = when (category) {
             DOUJINSHI -> BG_COLOR_DOUJINSHI
@@ -110,11 +126,11 @@ object EhUtils {
             MISC -> BG_COLOR_MISC
             else -> BG_COLOR_UNKNOWN
         }.toInt()
-        return MaterialColors.harmonizeWithPrimary(context, primary)
+        return harmonizeWithRole(context, primary)
     }
 
     @Composable
-    fun getCategoryColor(category: Int) = getCategoryColor(LocalContext.current, category)
+    fun getCategoryColor(category: Int) = Color(getCategoryColor(LocalContext.current, category))
 
     fun signOut() {
         EhCookieStore.signOut()
diff --git a/app/src/main/java/com/hippo/ehviewer/ui/main/GalleryInfo.kt b/app/src/main/java/com/hippo/ehviewer/ui/main/GalleryInfo.kt
index 70b8d5d79..8ab2dac73 100644
--- a/app/src/main/java/com/hippo/ehviewer/ui/main/GalleryInfo.kt
+++ b/app/src/main/java/com/hippo/ehviewer/ui/main/GalleryInfo.kt
@@ -21,7 +21,6 @@ import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.ProvideTextStyle
 import androidx.compose.material3.ShapeDefaults
 import androidx.compose.material3.Text
-import androidx.compose.material3.contentColorFor
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.produceState
@@ -29,7 +28,6 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.alpha
 import androidx.compose.ui.draw.clip
-import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.text.font.FontStyle
 import androidx.compose.ui.text.style.TextAlign
@@ -103,7 +101,7 @@ fun GalleryInfoListItem(
                             bottom.linkTo(categoryRef.top)
                         },
                     )
-                    val categoryColor = Color(EhUtils.getCategoryColor(info.category))
+                    val categoryColor = EhUtils.getCategoryColor(info.category)
                     val categoryText = EhUtils.getCategory(info.category).uppercase()
                     Text(
                         text = categoryText,
@@ -111,7 +109,7 @@ fun GalleryInfoListItem(
                             start.linkTo(parent.start)
                             bottom.linkTo(parent.bottom)
                         }.clip(ShapeDefaults.Small).background(categoryColor).padding(vertical = 2.dp, horizontal = 8.dp),
-                        color = Color.White,
+                        color = MaterialTheme.colorScheme.onPrimaryContainer,
                         textAlign = TextAlign.Center,
                     )
                     Row(
@@ -189,7 +187,6 @@ fun GalleryInfoGridItem(
     } else {
         DEFAULT_ASPECT
     }
-    val color = EhUtils.getCategoryColor(info.category)
     val simpleLang = info.simpleLanguage
     ElevatedCard(
         modifier = modifier,
@@ -202,11 +199,10 @@ fun GalleryInfoGridItem(
                 modifier = Modifier.aspectRatio(aspect).fillMaxWidth(),
                 contentScale = ContentScale.Crop,
             )
-            val container = Color(color)
             Badge(
                 modifier = Modifier.align(Alignment.TopEnd).width(32.dp).height(24.dp),
-                containerColor = container,
-                contentColor = contentColorFor(container),
+                containerColor = EhUtils.getCategoryColor(info.category),
+                contentColor = MaterialTheme.colorScheme.onPrimaryContainer,
             ) {
                 simpleLang?.let {
                     Text(text = it.uppercase())
diff --git a/app/src/main/res/layout/item_download.xml b/app/src/main/res/layout/item_download.xml
index deeabe199..e48e983b1 100644
--- a/app/src/main/res/layout/item_download.xml
+++ b/app/src/main/res/layout/item_download.xml
@@ -74,7 +74,7 @@
             android:paddingRight="8dp"
             android:paddingBottom="2dp"
             android:textAllCaps="true"
-            android:textColor="@android:color/white" />
+            android:textColor="?colorOnPrimaryContainer" />
 
         <ImageView
             android:id="@+id/handle"