diff --git a/apps/mobile/src/modules/discover/Category.tsx b/apps/mobile/src/modules/discover/Category.tsx
index 147e9096a..0b68b56c8 100644
--- a/apps/mobile/src/modules/discover/Category.tsx
+++ b/apps/mobile/src/modules/discover/Category.tsx
@@ -4,6 +4,7 @@ import { LinearGradient } from "expo-linear-gradient"
 import { memo } from "react"
 import { useTranslation } from "react-i18next"
 import { Pressable, StyleSheet, Text, View } from "react-native"
+import { useColor } from "react-native-uikit-colors"
 
 import { Grid } from "@/src/components/ui/grid"
 import { ItemPressable } from "@/src/components/ui/pressable/ItemPressable"
@@ -16,12 +17,13 @@ import { RecommendationCategoryScreen } from "@/src/screens/(stack)/recommendati
 
 export const Category = () => {
   const navigation = useNavigation()
+  const label = useColor("label")
 
   return (
     <>
       <View className="mt-4 flex-row items-center justify-between pb-1 pl-6 pr-5 pt-4">
         <View className="flex-row items-center gap-2">
-          <Grid2CuteReIcon width={24} height={24} />
+          <Grid2CuteReIcon width={24} height={24} color={label} />
           <Text className="text-label text-2xl font-bold leading-[1.1]">Categories</Text>
         </View>
         <ItemPressable
diff --git a/apps/mobile/src/modules/discover/Trending.tsx b/apps/mobile/src/modules/discover/Trending.tsx
index c363c4c00..8bf46668b 100644
--- a/apps/mobile/src/modules/discover/Trending.tsx
+++ b/apps/mobile/src/modules/discover/Trending.tsx
@@ -1,6 +1,7 @@
 import { cn } from "@follow/utils"
 import { useQuery } from "@tanstack/react-query"
 import { Text, View } from "react-native"
+import { useColor } from "react-native-uikit-colors"
 
 import { useUISettingKey } from "@/src/atoms/settings/ui"
 import { PlatformActivityIndicator } from "@/src/components/ui/loading/PlatformActivityIndicator"
@@ -21,6 +22,7 @@ export const Trending = ({
   className?: string
   itemClassName?: string
 }) => {
+  const label = useColor("label")
   const discoverLanguage = useUISettingKey("discoverLanguage")
   const { data, isLoading } = useQuery({
     queryKey: ["trending", "feeds", discoverLanguage],
@@ -36,7 +38,7 @@ export const Trending = ({
     <View className={className}>
       <View className={cn("flex-row items-center justify-between pb-1 pt-4", itemClassName)}>
         <View className="flex-row items-center gap-2">
-          <TrendingUpCuteReIcon width={24} height={24} />
+          <TrendingUpCuteReIcon width={24} height={24} color={label} />
           <Text className="text-label text-2xl font-bold leading-[1.1]">Trending</Text>
         </View>
         <ItemPressable
@@ -46,7 +48,7 @@ export const Trending = ({
             navigation.presentControllerView(DiscoverSettingsScreen)
           }}
         >
-          <FilterCuteReIcon width={20} height={20} />
+          <FilterCuteReIcon width={20} height={20} color={label} />
         </ItemPressable>
       </View>
 
@@ -73,10 +75,10 @@ export const Trending = ({
                           index === 1 && "bg-accent/90",
                           index === 2 && "bg-accent/80",
                         )
-                      : "bg-gray-5/60",
+                      : "bg-gray-5/60 dark:bg-white/60",
                   )}
                 >
-                  <Text className={cn("text-xs font-medium", index < 3 && "text-white")}>
+                  <Text className={cn("text-text text-xs font-medium", index < 3 && "text-white")}>
                     {index + 1}
                   </Text>
                 </View>