diff --git a/app/src/main/res/layout/topic_fragment.xml b/app/src/main/res/layout/topic_fragment.xml
index 76cf7c1940b..be08c19acdf 100644
--- a/app/src/main/res/layout/topic_fragment.xml
+++ b/app/src/main/res/layout/topic_fragment.xml
@@ -27,7 +27,7 @@
         android:id="@+id/topic_toolbar"
         android:layout_width="match_parent"
         android:layout_height="?attr/actionBarSize"
-        android:background="?attr/colorPrimary"
+        android:background="@color/component_color_topic_fragment_primary_toolbar_color"
         android:fontFamily="sans-serif"
         android:minHeight="?attr/actionBarSize"
         android:theme="@style/Widget.AppCompat.ActionBar"
@@ -52,7 +52,7 @@
         android:layout_marginEnd="@dimen/topic_fragment_tab_layout_margin_end"
         android:textSize="14sp"
         app:layout_constraintTop_toTopOf="parent"
-        app:tabBackground="@color/oppia_primary"
+        app:tabBackground="@color/component_color_topic_fragment_primary_tab_color"
         app:tabGravity="fill"
         app:tabIconTint="@color/tab_icon_color_selector"
         app:tabIndicatorColor="@android:color/white"
diff --git a/app/src/main/res/values/component_colors.xml b/app/src/main/res/values/component_colors.xml
index c0f7bc573a6..64569c005a3 100644
--- a/app/src/main/res/values/component_colors.xml
+++ b/app/src/main/res/values/component_colors.xml
@@ -239,5 +239,8 @@
   <color name="component_color_cellular_data_dialog_checkbox_color">@color/color_palette_dark_text_color</color>
   <!-- Profile Picture Edit Dialog -->
   <color name="component_color_profile_picture_edit_dialog_text_color">@color/color_palette_dark_text_color</color>
+  <!-- Topic Activity -->
+  <color name="component_color_topic_fragment_primary_toolbar_color">@color/color_palette_toolbar_color</color>
+  <color name="component_color_topic_fragment_primary_tab_color">@color/color_palette_secondary_toolbar_color</color>
 
 </resources>