diff --git a/src/components/interstitials/Trending.tsx b/src/components/interstitials/Trending.tsx
index f001e97a47..3944d92f07 100644
--- a/src/components/interstitials/Trending.tsx
+++ b/src/components/interstitials/Trending.tsx
@@ -33,7 +33,7 @@ export function TrendingInterstitial() {
 export function Inner() {
   const t = useTheme()
   const {_} = useLingui()
-  const gutters = useGutters(['base'])
+  const gutters = useGutters(['wide', 'base'])
   const trendingPrompt = Prompt.usePromptControl()
   const {setTrendingDisabled} = useTrendingSettingsApi()
   const {data: trending, error, isLoading} = useTrendingTopics()
@@ -73,7 +73,7 @@ export function Inner() {
         </Button>
       </View>
 
-      <View style={[a.flex_row, a.flex_wrap, {gap: '8px 6px'}]}>
+      <View style={[a.flex_row, a.flex_wrap, {rowGap: 8, columnGap: 6}]}>
         {isLoading ? (
           Array(TRENDING_TOPICS_COUNT)
             .fill(0)
diff --git a/src/screens/Search/components/ExploreTrendingTopics.tsx b/src/screens/Search/components/ExploreTrendingTopics.tsx
index 15e8d24752..e9be248cbf 100644
--- a/src/screens/Search/components/ExploreTrendingTopics.tsx
+++ b/src/screens/Search/components/ExploreTrendingTopics.tsx
@@ -69,7 +69,7 @@ function Inner() {
             a.flex_row,
             a.justify_start,
             a.flex_wrap,
-            {gap: '8px 6px'},
+            {rowGap: 8, columnGap: 6},
             gutters,
           ]}>
           {isLoading ? (