diff --git a/res/color/app_subtitle_text_dark.xml b/res/color-night-v31/widget_picker_primary_surface_color_dark.xml
similarity index 84%
rename from res/color/app_subtitle_text_dark.xml
rename to res/color-night-v31/widget_picker_primary_surface_color_dark.xml
index 220d10fc8f..13ceaa09e7 100644
--- a/res/color/app_subtitle_text_dark.xml
+++ b/res/color-night-v31/widget_picker_primary_surface_color_dark.xml
@@ -13,7 +13,8 @@
      See the License for the specific language governing permissions and
      limitations under the License.
 -->
-<selector xmlns:android="http://schemas.android.com/apk/res/android">
-    <item android:color="#EFF1F2" android:state_expanded="false" />
-    <item android:color="#191C1D" android:state_expanded="true" />
+<selector xmlns:android="http://schemas.android.com/apk/res/android" >
+    <item
+        android:color="@android:color/system_neutral1_900"
+        android:lStar="12" />
 </selector>
diff --git a/res/color/app_title_text_dark.xml b/res/color-night-v31/widget_picker_secondary_surface_color_dark.xml
similarity index 84%
rename from res/color/app_title_text_dark.xml
rename to res/color-night-v31/widget_picker_secondary_surface_color_dark.xml
index 220d10fc8f..89e9f81b99 100644
--- a/res/color/app_title_text_dark.xml
+++ b/res/color-night-v31/widget_picker_secondary_surface_color_dark.xml
@@ -13,7 +13,8 @@
      See the License for the specific language governing permissions and
      limitations under the License.
 -->
-<selector xmlns:android="http://schemas.android.com/apk/res/android">
-    <item android:color="#EFF1F2" android:state_expanded="false" />
-    <item android:color="#191C1D" android:state_expanded="true" />
+<selector xmlns:android="http://schemas.android.com/apk/res/android" >
+    <item
+        android:color="@android:color/system_neutral1_800"
+        android:lStar="24" />
 </selector>
diff --git a/res/color-night-v31/widget_picker_tab_background_unselected_dark.xml b/res/color-night-v31/widget_picker_tab_background_unselected_dark.xml
new file mode 100644
index 0000000000..ddd7b0a683
--- /dev/null
+++ b/res/color-night-v31/widget_picker_tab_background_unselected_dark.xml
@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Copyright (C) 2023 The Android Open Source Project
+
+     Licensed under the Apache License, Version 2.0 (the "License");
+     you may not use this file except in compliance with the License.
+     You may obtain a copy of the License at
+
+          http://www.apache.org/licenses/LICENSE-2.0
+
+     Unless required by applicable law or agreed to in writing, software
+     distributed under the License is distributed on an "AS IS" BASIS,
+     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+     See the License for the specific language governing permissions and
+     limitations under the License.
+-->
+<selector xmlns:android="http://schemas.android.com/apk/res/android" >
+    <item
+        android:color="@android:color/system_neutral1_800"
+        android:lStar="22" />
+</selector>
diff --git a/res/color/app_subtitle_text_light.xml b/res/color-v31/widget_picker_primary_surface_color_light.xml
similarity index 87%
rename from res/color/app_subtitle_text_light.xml
rename to res/color-v31/widget_picker_primary_surface_color_light.xml
index fb00baac6c..02dffdddf7 100644
--- a/res/color/app_subtitle_text_light.xml
+++ b/res/color-v31/widget_picker_primary_surface_color_light.xml
@@ -13,6 +13,8 @@
      See the License for the specific language governing permissions and
      limitations under the License.
 -->
-<selector xmlns:android="http://schemas.android.com/apk/res/android">
-    <item android:color="?android:attr/textColorSecondary"/>
+<selector xmlns:android="http://schemas.android.com/apk/res/android" >
+    <item
+        android:color="@android:color/system_accent2_50"
+        android:lStar="94" />
 </selector>
diff --git a/res/color/app_title_text_light.xml b/res/color-v31/widget_picker_secondary_surface_color_light.xml
similarity index 87%
rename from res/color/app_title_text_light.xml
rename to res/color-v31/widget_picker_secondary_surface_color_light.xml
index bb5297319d..cd052681e9 100644
--- a/res/color/app_title_text_light.xml
+++ b/res/color-v31/widget_picker_secondary_surface_color_light.xml
@@ -13,6 +13,8 @@
      See the License for the specific language governing permissions and
      limitations under the License.
 -->
-<selector xmlns:android="http://schemas.android.com/apk/res/android">
-    <item android:color="?android:attr/textColorPrimary"/>
+<selector xmlns:android="http://schemas.android.com/apk/res/android" >
+    <item
+        android:color="@android:color/system_neutral1_0"
+        android:lStar="98" />
 </selector>
diff --git a/res/color/widget_picker_tab_text.xml b/res/color/widget_picker_tab_text.xml
new file mode 100644
index 0000000000..0e0fc38316
--- /dev/null
+++ b/res/color/widget_picker_tab_text.xml
@@ -0,0 +1,19 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Copyright (C) 2023 The Android Open Source Project
+
+     Licensed under the Apache License, Version 2.0 (the "License");
+     you may not use this file except in compliance with the License.
+     You may obtain a copy of the License at
+
+          http://www.apache.org/licenses/LICENSE-2.0
+
+     Unless required by applicable law or agreed to in writing, software
+     distributed under the License is distributed on an "AS IS" BASIS,
+     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+     See the License for the specific language governing permissions and
+     limitations under the License.
+-->
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:color="?attr/widgetPickerSelectedTabTextColor" android:state_selected="true"/>
+    <item android:color="?attr/widgetPickerUnselectedTabTextColor"/>
+</selector>
\ No newline at end of file
diff --git a/res/color/widgets_picker_scrim.xml b/res/color/widgets_picker_scrim.xml
index 5d5130086a..1cf97f61f7 100644
--- a/res/color/widgets_picker_scrim.xml
+++ b/res/color/widgets_picker_scrim.xml
@@ -18,5 +18,5 @@
 */
 -->
 <selector xmlns:android="http://schemas.android.com/apk/res/android">
-    <item android:color="#000000" android:alpha="0.65" />
+    <item android:color="#000000" android:alpha="0.32" />
 </selector>
diff --git a/res/drawable/bg_widgets_content.xml b/res/drawable/bg_widgets_content.xml
index b0b699ba22..1528a9787a 100644
--- a/res/drawable/bg_widgets_content.xml
+++ b/res/drawable/bg_widgets_content.xml
@@ -24,7 +24,7 @@
     <!-- SINGLE : L L L L -->
     <item android:state_single="true">
         <shape android:shape="rectangle">
-            <solid android:color="@color/surface" />
+            <solid android:color="?attr/widgetPickerSecondarySurfaceColor" />
             <corners android:radius="@dimen/widget_list_top_bottom_corner_radius"/>
         </shape>
     </item>
@@ -32,7 +32,7 @@
     <!-- FIRST : 0 0 s s -->
     <item android:state_first="true">
         <shape android:shape="rectangle">
-            <solid android:color="@color/surface" />
+            <solid android:color="?attr/widgetPickerSecondarySurfaceColor" />
             <corners
                 android:bottomLeftRadius="@dimen/widget_list_content_corner_radius"
                 android:bottomRightRadius="@dimen/widget_list_content_corner_radius" />
@@ -42,7 +42,7 @@
     <!-- MIDDLE : 0 0 s s -->
     <item android:state_middle="true">
         <shape android:shape="rectangle">
-            <solid android:color="@color/surface" />
+            <solid android:color="?attr/widgetPickerSecondarySurfaceColor" />
             <corners
                 android:bottomLeftRadius="@dimen/widget_list_content_corner_radius"
                 android:bottomRightRadius="@dimen/widget_list_content_corner_radius" />
@@ -52,7 +52,7 @@
     <!-- LAST : 0 0 L L -->
     <item android:state_last="true">
         <shape android:shape="rectangle">
-            <solid android:color="@color/surface" />
+            <solid android:color="?attr/widgetPickerSecondarySurfaceColor" />
             <corners
                 android:bottomLeftRadius="@dimen/widget_list_top_bottom_corner_radius"
                 android:bottomRightRadius="@dimen/widget_list_top_bottom_corner_radius" />
diff --git a/res/drawable/bg_widgets_full_sheet.xml b/res/drawable/bg_widgets_full_sheet.xml
index dfcd354ce7..66a1d40507 100644
--- a/res/drawable/bg_widgets_full_sheet.xml
+++ b/res/drawable/bg_widgets_full_sheet.xml
@@ -16,7 +16,7 @@
 
 <shape xmlns:android="http://schemas.android.com/apk/res/android"
     android:shape="rectangle" >
-    <solid android:color="?android:attr/colorBackground" />
+    <solid android:color="?attr/widgetPickerPrimarySurfaceColor" />
     <corners
         android:topLeftRadius="@dimen/dialogCornerRadius"
         android:topRightRadius="@dimen/dialogCornerRadius" />
diff --git a/res/drawable/bg_widgets_header_states.xml b/res/drawable/bg_widgets_header_states.xml
index f45a7ababf..d03778d0c6 100644
--- a/res/drawable/bg_widgets_header_states.xml
+++ b/res/drawable/bg_widgets_header_states.xml
@@ -24,7 +24,7 @@
     <!-- SINGLE : L L L L -->
     <item android:state_single="true">
         <shape android:shape="rectangle">
-            <solid android:color="@color/surface" />
+            <solid android:color="?attr/widgetPickerSecondarySurfaceColor" />
             <corners
                 android:topLeftRadius="@dimen/widget_list_top_bottom_corner_radius"
                 android:topRightRadius="@dimen/widget_list_top_bottom_corner_radius"
@@ -36,7 +36,7 @@
     <!-- FIRST_EXPANDED : L L 0 0 -->
     <item android:state_first="true" android:state_expanded="true">
         <shape android:shape="rectangle">
-            <solid android:color="@color/surface" />
+            <solid android:color="?attr/widgetPickerSecondarySurfaceColor" />
             <corners
                 android:topLeftRadius="@dimen/widget_list_top_bottom_corner_radius"
                 android:topRightRadius="@dimen/widget_list_top_bottom_corner_radius"
@@ -48,7 +48,7 @@
     <!-- FIRST : L L s s -->
     <item android:state_first="true" >
         <shape android:shape="rectangle">
-            <solid android:color="@color/surface" />
+            <solid android:color="?attr/widgetPickerSecondarySurfaceColor" />
             <corners
                 android:topLeftRadius="@dimen/widget_list_top_bottom_corner_radius"
                 android:topRightRadius="@dimen/widget_list_top_bottom_corner_radius"
@@ -60,7 +60,7 @@
     <!-- MIDDLE_EXPANDED : s s 0 0 -->
     <item android:state_middle="true" android:state_expanded="true">
         <shape android:shape="rectangle">
-            <solid android:color="@color/surface" />
+            <solid android:color="?attr/widgetPickerSecondarySurfaceColor" />
             <corners
                 android:topLeftRadius="@dimen/widget_list_content_corner_radius"
                 android:topRightRadius="@dimen/widget_list_content_corner_radius"
@@ -72,7 +72,7 @@
     <!-- MIDDLE : s s s s -->
     <item android:state_middle="true">
         <shape android:shape="rectangle">
-            <solid android:color="@color/surface" />
+            <solid android:color="?attr/widgetPickerSecondarySurfaceColor" />
             <corners
                 android:topLeftRadius="@dimen/widget_list_content_corner_radius"
                 android:topRightRadius="@dimen/widget_list_content_corner_radius"
@@ -84,7 +84,7 @@
     <!-- LAST : s s L L -->
     <item android:state_last="true">
         <shape android:shape="rectangle">
-            <solid android:color="@color/surface" />
+            <solid android:color="?attr/widgetPickerSecondarySurfaceColor" />
             <corners
                 android:topLeftRadius="@dimen/widget_list_content_corner_radius"
                 android:topRightRadius="@dimen/widget_list_content_corner_radius"
diff --git a/res/drawable/bg_widgets_header_states_large_screen.xml b/res/drawable/bg_widgets_header_states_two_pane.xml
similarity index 93%
rename from res/drawable/bg_widgets_header_states_large_screen.xml
rename to res/drawable/bg_widgets_header_states_two_pane.xml
index 1ee5fe5585..5f4b8c66b4 100644
--- a/res/drawable/bg_widgets_header_states_large_screen.xml
+++ b/res/drawable/bg_widgets_header_states_two_pane.xml
@@ -17,7 +17,7 @@
 
     <item android:state_expanded="true">
         <shape android:shape="rectangle">
-            <solid android:color="@color/widget_picker_background_selected" />
+            <solid android:color="?attr/widgetPickerHeaderBackgroundColor" />
             <corners android:radius="@dimen/widget_list_top_bottom_corner_radius" />
         </shape>
     </item>
diff --git a/res/drawable/bg_widgets_header_two_pane.xml b/res/drawable/bg_widgets_header_two_pane.xml
index e1408cc235..ca3feef1f0 100644
--- a/res/drawable/bg_widgets_header_two_pane.xml
+++ b/res/drawable/bg_widgets_header_two_pane.xml
@@ -20,7 +20,7 @@
         android:paddingTop="@dimen/widget_list_header_view_vertical_padding"
         android:paddingBottom="@dimen/widget_list_header_view_vertical_padding" >
         <item android:id="@android:id/mask"
-            android:drawable="@drawable/bg_widgets_header_states_large_screen" />
-        <item android:drawable="@drawable/bg_widgets_header_states_large_screen" />
+            android:drawable="@drawable/bg_widgets_header_states_two_pane" />
+        <item android:drawable="@drawable/bg_widgets_header_states_two_pane" />
     </ripple>
 </inset>
diff --git a/res/drawable/bg_widgets_searchbox.xml b/res/drawable/bg_widgets_searchbox.xml
index dc6d868bd7..b09f0cd1b6 100644
--- a/res/drawable/bg_widgets_searchbox.xml
+++ b/res/drawable/bg_widgets_searchbox.xml
@@ -14,6 +14,6 @@
      limitations under the License.
 -->
 <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
-    <solid android:color="@color/surface" />
+    <solid android:color="?attr/widgetPickerSecondarySurfaceColor" />
     <corners android:radius="24dp" />
 </shape>
\ No newline at end of file
diff --git a/res/drawable/ic_allapps_search.xml b/res/drawable/ic_allapps_search.xml
index dbed824358..0c3ab78575 100644
--- a/res/drawable/ic_allapps_search.xml
+++ b/res/drawable/ic_allapps_search.xml
@@ -20,6 +20,6 @@
     android:viewportWidth="24.0"
     android:autoMirrored="true">
     <path
-        android:fillColor="?android:attr/textColorTertiary"
+        android:fillColor="?attr/widgetPickerSearchTextColor"
         android:pathData="M15.5,14h-0.79l-0.28,-0.27C15.41,12.59 16,11.11 16,9.5 16,5.91 13.09,3 9.5,3S3,5.91 3,9.5 5.91,16 9.5,16c1.61,0 3.09,-0.59 4.23,-1.57l0.27,0.28v0.79l5,4.99L20.49,19l-4.99,-5zM9.5,14C7.01,14 5,11.99 5,9.5S7.01,5 9.5,5 14,7.01 14,9.5 11.99,14 9.5,14z" />
 </vector>
diff --git a/res/drawable/widget_picker_collapse_handle.xml b/res/drawable/widget_picker_collapse_handle.xml
new file mode 100644
index 0000000000..f79663d00e
--- /dev/null
+++ b/res/drawable/widget_picker_collapse_handle.xml
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Copyright (C) 2023 The Android Open Source Project
+
+     Licensed under the Apache License, Version 2.0 (the "License");
+     you may not use this file except in compliance with the License.
+     You may obtain a copy of the License at
+
+          http://www.apache.org/licenses/LICENSE-2.0
+
+     Unless required by applicable law or agreed to in writing, software
+     distributed under the License is distributed on an "AS IS" BASIS,
+     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+     See the License for the specific language governing permissions and
+     limitations under the License.
+-->
+
+<shape xmlns:android="http://schemas.android.com/apk/res/android"
+    android:shape="rectangle" >
+    <solid android:color="?attr/widgetPickerCollapseHandleColor"/>
+    <corners android:radius="@dimen/bottom_sheet_handle_corner_radius" />
+</shape>
diff --git a/res/drawable/widget_picker_tabs_background.xml b/res/drawable/widget_picker_tabs_background.xml
new file mode 100644
index 0000000000..a874dd8b90
--- /dev/null
+++ b/res/drawable/widget_picker_tabs_background.xml
@@ -0,0 +1,48 @@
+<?xml version="1.0" encoding="utf-8"?><!--
+     Copyright (C) 2021 The Android Open Source Project
+
+     Licensed under the Apache License, Version 2.0 (the "License");
+     you may not use this file except in compliance with the License.
+     You may obtain a copy of the License at
+
+          http://www.apache.org/licenses/LICENSE-2.0
+
+     Unless required by applicable law or agreed to in writing, software
+     distributed under the License is distributed on an "AS IS" BASIS,
+     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+     See the License for the specific language governing permissions and
+     limitations under the License.
+-->
+<ripple xmlns:android="http://schemas.android.com/apk/res/android"
+    android:color="@color/accent_ripple_color">
+
+    <item android:id="@android:id/mask">
+        <shape android:shape="rectangle">
+            <corners android:radius="@dimen/all_apps_header_pill_corner_radius" />
+            <solid android:color="@color/accent_ripple_color" />
+        </shape>
+    </item>
+
+    <item>
+        <selector android:enterFadeDuration="100">
+            <item
+                android:id="@+id/unselected"
+                android:state_selected="false">
+                <shape android:shape="rectangle">
+                    <corners android:radius="@dimen/all_apps_header_pill_corner_radius" />
+                    <solid android:color="?attr/widgetPickerTabBackgroundUnselected"/>
+                </shape>
+            </item>
+
+            <item
+                android:id="@+id/selected"
+                android:state_selected="true">
+                <shape android:shape="rectangle">
+                    <corners android:radius="@dimen/all_apps_header_pill_corner_radius" />
+                    <solid android:color="?attr/widgetPickerTabBackgroundSelected"/>
+                </shape>
+            </item>
+        </selector>
+    </item>
+
+</ripple>
\ No newline at end of file
diff --git a/res/drawable/widget_suggestions.xml b/res/drawable/widget_suggestions.xml
index b090a68a43..61e42434ba 100644
--- a/res/drawable/widget_suggestions.xml
+++ b/res/drawable/widget_suggestions.xml
@@ -18,7 +18,7 @@ Copyright (C) 2023 The Android Open Source Project
     android:height="24dp"
     android:viewportWidth="24"
     android:viewportHeight="24"
-    android:tint="@color/widget_picker_background_selected"
+    android:tint="?attr/widgetPickerSuggestionsIconColor"
     android:gravity="center"
     >
     <path
diff --git a/res/drawable/widget_suggestions_icon.xml b/res/drawable/widget_suggestions_icon.xml
index 919b5e4452..8fe1ce513f 100644
--- a/res/drawable/widget_suggestions_icon.xml
+++ b/res/drawable/widget_suggestions_icon.xml
@@ -19,7 +19,7 @@ Copyright (C) 2023 The Android Open Source Project
       <size
           android:width="48dp"
           android:height="48dp" />
-      <solid android:color="@color/surface"/>
+      <solid android:color="?attr/widgetPickerSuggestionsIconBackgroundColor"/>
     </shape>
   </item>
   <item
diff --git a/res/drawable/widgets_surface_background.xml b/res/drawable/widgets_surface_background.xml
index 0550a34926..a31623d183 100644
--- a/res/drawable/widgets_surface_background.xml
+++ b/res/drawable/widgets_surface_background.xml
@@ -19,6 +19,6 @@
 -->
 <shape android:shape="rectangle"
     xmlns:android="http://schemas.android.com/apk/res/android">
-    <solid android:color="@color/surface" />
+    <solid android:color="?attr/widgetPickerSecondarySurfaceColor" />
     <corners android:radius="@dimen/widget_list_top_bottom_corner_radius"/>
 </shape>
\ No newline at end of file
diff --git a/res/layout/widgets_full_sheet.xml b/res/layout/widgets_full_sheet.xml
index e31bf7affe..9ec346a261 100644
--- a/res/layout/widgets_full_sheet.xml
+++ b/res/layout/widgets_full_sheet.xml
@@ -34,7 +34,7 @@
             android:layout_height="@dimen/bottom_sheet_handle_height"
             android:layout_marginTop="@dimen/bottom_sheet_handle_margin"
             android:layout_centerHorizontal="true"
-            android:background="@drawable/bg_rounded_corner_bottom_sheet_handle"/>
+            android:background="@drawable/widget_picker_collapse_handle"/>
 
         <TextView
             style="@style/PrimaryHeadline"
diff --git a/res/layout/widgets_full_sheet_paged_view.xml b/res/layout/widgets_full_sheet_paged_view.xml
index 455217f143..94f707ac14 100644
--- a/res/layout/widgets_full_sheet_paged_view.xml
+++ b/res/layout/widgets_full_sheet_paged_view.xml
@@ -59,7 +59,7 @@
             android:gravity="center_horizontal"
             android:textSize="24sp"
             android:layout_marginTop="24dp"
-            android:textColor="?android:attr/textColorSecondary"
+            android:textColor="?attr/widgetPickerTitleColor"
             android:text="@string/widget_button_text"/>
 
         <FrameLayout
@@ -67,7 +67,7 @@
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:elevation="0.1dp"
-            android:background="?android:attr/colorBackground"
+            android:background="?attr/widgetPickerPrimarySurfaceColor"
             android:paddingBottom="8dp"
             launcher:layout_sticky="true">
             <include layout="@layout/widgets_search_bar" />
@@ -89,7 +89,7 @@
             android:gravity="center_horizontal"
             android:orientation="horizontal"
             android:paddingVertical="8dp"
-            android:background="?android:attr/colorBackground"
+            android:background="?attr/widgetPickerPrimarySurfaceColor"
             style="@style/TextHeadline"
             launcher:layout_sticky="true">
 
@@ -100,9 +100,9 @@
                 android:layout_marginEnd="@dimen/widget_tabs_button_horizontal_padding"
                 android:layout_marginVertical="@dimen/widget_apps_tabs_vertical_padding"
                 android:layout_weight="1"
-                android:background="@drawable/all_apps_tabs_background"
+                android:background="@drawable/widget_picker_tabs_background"
                 android:text="@string/widgets_full_sheet_personal_tab"
-                android:textColor="@color/all_apps_tab_text"
+                android:textColor="@color/widget_picker_tab_text"
                 android:textSize="14sp"
                 style="?android:attr/borderlessButtonStyle" />
 
@@ -113,9 +113,9 @@
                 android:layout_marginEnd="@dimen/widget_tabs_button_horizontal_padding"
                 android:layout_marginVertical="@dimen/widget_apps_tabs_vertical_padding"
                 android:layout_weight="1"
-                android:background="@drawable/all_apps_tabs_background"
+                android:background="@drawable/widget_picker_tabs_background"
                 android:text="@string/widgets_full_sheet_work_tab"
-                android:textColor="@color/all_apps_tab_text"
+                android:textColor="@color/widget_picker_tab_text"
                 android:textSize="14sp"
                 style="?android:attr/borderlessButtonStyle" />
         </com.android.launcher3.workprofile.PersonalWorkSlidingTabStrip>
diff --git a/res/layout/widgets_full_sheet_recyclerview.xml b/res/layout/widgets_full_sheet_recyclerview.xml
index 887f00cbd0..25bbad41fa 100644
--- a/res/layout/widgets_full_sheet_recyclerview.xml
+++ b/res/layout/widgets_full_sheet_recyclerview.xml
@@ -41,7 +41,7 @@
             android:gravity="center_horizontal"
             android:textSize="24sp"
             android:layout_marginTop="24dp"
-            android:textColor="?android:attr/textColorSecondary"
+            android:textColor="?attr/widgetPickerTitleColor"
             android:text="@string/widget_button_text"/>
 
         <FrameLayout
@@ -49,7 +49,7 @@
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:elevation="0.1dp"
-            android:background="?android:attr/colorBackground"
+            android:background="?attr/widgetPickerPrimarySurfaceColor"
             android:paddingBottom="8dp"
             android:clipToPadding="false"
             launcher:layout_sticky="true" >
diff --git a/res/layout/widgets_search_bar.xml b/res/layout/widgets_search_bar.xml
index 6d44865ef0..a615c5e025 100644
--- a/res/layout/widgets_search_bar.xml
+++ b/res/layout/widgets_search_bar.xml
@@ -25,7 +25,7 @@
         android:imeOptions="actionSearch"
         android:importantForAutofill="no"
         android:textColor="?android:attr/textColorPrimary"
-        android:textColorHint="?android:attr/textColorSecondary"/>
+        android:textColorHint="?attr/widgetPickerSearchTextColor"/>
 
     <ImageButton
         android:id="@+id/widgets_search_cancel_button"
diff --git a/res/layout/widgets_two_pane_sheet.xml b/res/layout/widgets_two_pane_sheet.xml
index 4333a80095..01c1b1087f 100644
--- a/res/layout/widgets_two_pane_sheet.xml
+++ b/res/layout/widgets_two_pane_sheet.xml
@@ -33,7 +33,7 @@
             android:layout_height="@dimen/bottom_sheet_handle_height"
             android:layout_marginTop="@dimen/bottom_sheet_handle_margin"
             android:layout_centerHorizontal="true"
-            android:background="@drawable/bg_rounded_corner_bottom_sheet_handle"/>
+            android:background="@drawable/widget_picker_collapse_handle"/>
 
         <TextView
             android:id="@+id/title"
@@ -44,7 +44,7 @@
             android:layout_below="@id/collapse_handle"
             android:paddingHorizontal="@dimen/widget_list_horizontal_margin_two_pane"
             android:text="@string/widget_button_text"
-            android:textColor="?android:attr/textColorSecondary"
+            android:textColor="?attr/widgetPickerTitleColor"
             android:textSize="24sp" />
 
         <LinearLayout
diff --git a/res/layout/widgets_two_pane_sheet_paged_view.xml b/res/layout/widgets_two_pane_sheet_paged_view.xml
index d3a85849fc..2e05d48bb6 100644
--- a/res/layout/widgets_two_pane_sheet_paged_view.xml
+++ b/res/layout/widgets_two_pane_sheet_paged_view.xml
@@ -58,7 +58,7 @@
                 android:id="@+id/search_bar_container"
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
-                android:background="?android:attr/colorBackground"
+                android:background="?attr/widgetPickerPrimarySurfaceColor"
                 android:clipToPadding="false"
                 android:elevation="0.1dp"
                 android:paddingBottom="8dp"
@@ -75,7 +75,7 @@
                 android:layout_marginTop="8dp"
                 android:layout_marginHorizontal="@dimen/widget_list_horizontal_margin_two_pane"
                 android:orientation="horizontal"
-                android:background="?android:attr/colorBackground"
+                android:background="?attr/widgetPickerPrimarySurfaceColor"
                 launcher:layout_sticky="true">
             </LinearLayout>
 
@@ -87,7 +87,7 @@
                 android:orientation="horizontal"
                 android:paddingVertical="8dp"
                 android:layout_marginHorizontal="@dimen/widget_list_horizontal_margin_two_pane"
-                android:background="?android:attr/colorBackground"
+                android:background="?attr/widgetPickerPrimarySurfaceColor"
                 style="@style/TextHeadline"
                 launcher:layout_sticky="true">
 
@@ -98,9 +98,9 @@
                     android:layout_marginEnd="@dimen/widget_tabs_button_horizontal_padding"
                     android:layout_marginVertical="@dimen/widget_apps_tabs_vertical_padding"
                     android:layout_weight="1"
-                    android:background="@drawable/all_apps_tabs_background"
+                    android:background="@drawable/widget_picker_tabs_background"
                     android:text="@string/widgets_full_sheet_personal_tab"
-                    android:textColor="@color/all_apps_tab_text"
+                    android:textColor="@color/widget_picker_tab_text"
                     android:textSize="14sp"
                     style="?android:attr/borderlessButtonStyle" />
 
@@ -111,9 +111,9 @@
                     android:layout_marginEnd="@dimen/widget_tabs_button_horizontal_padding"
                     android:layout_marginVertical="@dimen/widget_apps_tabs_vertical_padding"
                     android:layout_weight="1"
-                    android:background="@drawable/all_apps_tabs_background"
+                    android:background="@drawable/widget_picker_tabs_background"
                     android:text="@string/widgets_full_sheet_work_tab"
-                    android:textColor="@color/all_apps_tab_text"
+                    android:textColor="@color/widget_picker_tab_text"
                     android:textSize="14sp"
                     style="?android:attr/borderlessButtonStyle" />
 
diff --git a/res/layout/widgets_two_pane_sheet_recyclerview.xml b/res/layout/widgets_two_pane_sheet_recyclerview.xml
index 8f2a25e409..f8d72e89d4 100644
--- a/res/layout/widgets_two_pane_sheet_recyclerview.xml
+++ b/res/layout/widgets_two_pane_sheet_recyclerview.xml
@@ -43,7 +43,7 @@
                 android:id="@+id/search_bar_container"
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
-                android:background="?android:attr/colorBackground"
+                android:background="?attr/widgetPickerPrimarySurfaceColor"
                 android:clipToPadding="false"
                 android:elevation="0.1dp"
                 android:paddingBottom="8dp"
@@ -61,7 +61,7 @@
                 android:layout_marginHorizontal="@dimen/widget_list_horizontal_margin_two_pane"
                 android:paddingBottom="16dp"
                 android:orientation="horizontal"
-                android:background="?android:attr/colorBackground"
+                android:background="?attr/widgetPickerPrimarySurfaceColor"
                 launcher:layout_sticky="true">
             </LinearLayout>
         </com.android.launcher3.views.StickyHeaderLayout>
diff --git a/res/values-night-v31/colors.xml b/res/values-night-v31/colors.xml
index f331361f71..4dd3849cf8 100644
--- a/res/values-night-v31/colors.xml
+++ b/res/values-night-v31/colors.xml
@@ -26,4 +26,27 @@
     <color name="home_settings_track_off_color">@android:color/system_neutral1_700</color>
 
     <color name="all_apps_button_color">@android:color/system_neutral2_200</color>
+
+    <color name="widget_picker_title_color_dark">@android:color/system_neutral1_100</color>
+    <color name="widget_picker_header_app_title_color_dark">
+        @android:color/system_neutral1_100</color>
+    <color name="widget_picker_header_app_subtitle_color_dark">
+        @android:color/system_neutral2_200</color>
+    <color name="widget_picker_header_background_color_dark">
+        @android:color/system_accent2_700</color>
+    <color name="widget_picker_suggestions_icon_background_color_dark">
+        @android:color/system_accent1_800</color>
+    <color name="widget_picker_suggestions_icon_color_dark">
+        @android:color/system_accent1_200</color>
+    <color name="widget_picker_search_text_color_dark">
+        @android:color/system_neutral2_200</color>
+    <color name="widget_picker_tab_background_selected_dark">
+        @android:color/system_accent1_200</color>
+    <color name="widget_picker_selected_tab_text_color_dark">
+        @android:color/system_accent1_800</color>
+    <color name="widget_picker_unselected_tab_text_color_dark">
+        @android:color/system_neutral2_200</color>
+    <color name="widget_picker_collapse_handle_color_dark">
+        @android:color/system_neutral2_700</color>
+
 </resources>
\ No newline at end of file
diff --git a/res/values-v31/colors.xml b/res/values-v31/colors.xml
index 054fe47125..985fe77f62 100644
--- a/res/values-v31/colors.xml
+++ b/res/values-v31/colors.xml
@@ -64,5 +64,28 @@
 
     <color name="all_apps_button_color">@android:color/system_neutral2_700</color>
 
-    <color name="widget_picker_background_selected">@android:color/system_accent2_100</color>
+    <color name="widget_picker_title_color_light">
+        @android:color/system_neutral1_900</color>
+    <color name="widget_picker_header_app_title_color_light">
+        @android:color/system_neutral1_900</color>
+    <color name="widget_picker_header_app_subtitle_color_light">
+        @android:color/system_neutral2_700</color>
+    <color name="widget_picker_header_background_color_light">
+        @android:color/system_accent2_100</color>
+    <color name="widget_picker_suggestions_icon_background_color_light">
+        @android:color/system_accent1_0</color>
+    <color name="widget_picker_suggestions_icon_color_light">
+        @android:color/system_accent1_600</color>
+    <color name="widget_picker_search_text_color_light">
+        @android:color/system_neutral2_700</color>
+    <color name="widget_picker_tab_background_selected_light">
+        @android:color/system_accent1_600</color>
+    <color name="widget_picker_tab_background_unselected_light">
+        @android:color/system_neutral1_100</color>
+    <color name="widget_picker_selected_tab_text_color_light">
+        @android:color/system_accent1_0</color>
+    <color name="widget_picker_unselected_tab_text_color_light">
+        @android:color/system_neutral2_700</color>
+    <color name="widget_picker_collapse_handle_color_light">
+        @android:color/system_neutral2_200</color>
 </resources>
diff --git a/res/values/attrs.xml b/res/values/attrs.xml
index 417ae6171e..ce8d90166b 100644
--- a/res/values/attrs.xml
+++ b/res/values/attrs.xml
@@ -54,8 +54,20 @@
     <attr name="dropTargetHoverTextColor" format="color" />
     <attr name="preloadIconAccentColor" format="color" />
     <attr name="preloadIconBackgroundColor" format="color" />
+    <attr name="widgetPickerTitleColor" format="color"/>
+    <attr name="widgetPickerPrimarySurfaceColor" format="color"/>
+    <attr name="widgetPickerSecondarySurfaceColor" format="color"/>
     <attr name="widgetPickerHeaderAppTitleColor" format="color"/>
     <attr name="widgetPickerHeaderAppSubtitleColor" format="color"/>
+    <attr name="widgetPickerHeaderBackgroundColor" format="color"/>
+    <attr name="widgetPickerSuggestionsIconBackgroundColor" format="color"/>
+    <attr name="widgetPickerSuggestionsIconColor" format="color"/>
+    <attr name="widgetPickerTabBackgroundSelected" format="color"/>
+    <attr name="widgetPickerTabBackgroundUnselected" format="color"/>
+    <attr name="widgetPickerSearchTextColor" format="color"/>
+    <attr name="widgetPickerSelectedTabTextColor" format="color"/>
+    <attr name="widgetPickerUnselectedTabTextColor" format="color"/>
+    <attr name="widgetPickerCollapseHandleColor" format="color"/>
 
     <!-- BubbleTextView specific attributes. -->
     <declare-styleable name="BubbleTextView">
diff --git a/res/values/colors.xml b/res/values/colors.xml
index 87885576e3..58a447d3cb 100644
--- a/res/values/colors.xml
+++ b/res/values/colors.xml
@@ -88,4 +88,34 @@
     <color name="preload_icon_background_color_dark">#40484D</color>
 
     <color name="work_turn_on_stroke">?android:attr/colorAccent</color>
+
+    <color name="widget_picker_primary_surface_color_light">#EFEDED</color>
+    <color name="widget_picker_secondary_surface_color_light">#FAF9F8</color>
+    <color name="widget_picker_title_color_light">#1F1F1F</color>
+    <color name="widget_picker_header_app_title_color_light">#1F1F1F</color>
+    <color name="widget_picker_header_app_subtitle_color_light">#444746</color>
+    <color name="widget_picker_header_background_color_light">#C2E7FF</color>
+    <color name="widget_picker_suggestions_icon_background_color_light">#FFFFFF</color>
+    <color name="widget_picker_suggestions_icon_color_light">#0B57D0</color>
+    <color name="widget_picker_search_text_color_light">#444746</color>
+    <color name="widget_picker_tab_background_selected_light">#0B57D0</color>
+    <color name="widget_picker_tab_background_unselected_light">#E3E3E3</color>
+    <color name="widget_picker_selected_tab_text_color_light">#FFFFFF</color>
+    <color name="widget_picker_unselected_tab_text_color_light">#444746</color>
+    <color name="widget_picker_collapse_handle_color_light">#C4C7C5</color>
+
+    <color name="widget_picker_primary_surface_color_dark">#1F2020</color>
+    <color name="widget_picker_secondary_surface_color_dark">#393939</color>
+    <color name="widget_picker_title_color_dark">#E3E3E3</color>
+    <color name="widget_picker_header_app_title_color_dark">#E3E3E3</color>
+    <color name="widget_picker_header_app_subtitle_color_dark">#C4C7C5</color>
+    <color name="widget_picker_header_background_color_dark">#004A77</color>
+    <color name="widget_picker_suggestions_icon_background_color_dark">#FFFFFFFF</color>
+    <color name="widget_picker_suggestions_icon_color_dark">#062E6F</color>
+    <color name="widget_picker_search_text_color_dark">#C4C7C5</color>
+    <color name="widget_picker_tab_background_selected_dark">#A8C7FA</color>
+    <color name="widget_picker_tab_background_unselected_dark">#343535</color>
+    <color name="widget_picker_selected_tab_text_color_dark">#2D312F</color>
+    <color name="widget_picker_unselected_tab_text_color_dark">#C4C7C5</color>
+    <color name="widget_picker_collapse_handle_color_dark">#444746</color>
 </resources>
diff --git a/res/values/styles.xml b/res/values/styles.xml
index 5dc4f0afa1..98d09e737c 100644
--- a/res/values/styles.xml
+++ b/res/values/styles.xml
@@ -174,14 +174,63 @@
         <item name="android:colorPrimaryDark">#E8EAED</item>
         <item name="android:textColorSecondary">?android:attr/textColorPrimary</item>
         <item name="android:colorEdgeEffect">?android:attr/textColorSecondary</item>
-        <item name="widgetPickerHeaderAppTitleColor">@color/app_title_text_light</item>
-        <item name="widgetPickerHeaderAppSubtitleColor">@color/app_subtitle_text_light</item>
+        <item name="widgetPickerPrimarySurfaceColor">
+            @color/widget_picker_primary_surface_color_light</item>
+        <item name="widgetPickerSecondarySurfaceColor">
+            @color/widget_picker_secondary_surface_color_light</item>
+        <item name="widgetPickerTitleColor">@color/widget_picker_title_color_light</item>
+        <item name="widgetPickerHeaderAppTitleColor">
+            @color/widget_picker_header_app_title_color_light</item>
+        <item name="widgetPickerHeaderAppSubtitleColor">
+            @color/widget_picker_header_app_subtitle_color_light</item>
+        <item name="widgetPickerHeaderBackgroundColor">
+            @color/widget_picker_header_background_color_light</item>
+        <item name="widgetPickerSuggestionsIconBackgroundColor">
+            @color/widget_picker_suggestions_icon_background_color_light</item>
+        <item name="widgetPickerSuggestionsIconColor">
+            @color/widget_picker_suggestions_icon_color_light</item>
+        <item name="widgetPickerSearchTextColor">@color/widget_picker_search_text_color_light</item>
+        <item name="widgetPickerTabBackgroundSelected">
+            @color/widget_picker_tab_background_selected_light</item>
+        <item name="widgetPickerTabBackgroundUnselected">
+            @color/widget_picker_tab_background_unselected_light</item>
+        <item name="widgetPickerSelectedTabTextColor">
+            @color/widget_picker_selected_tab_text_color_light</item>
+        <item name="widgetPickerUnselectedTabTextColor">
+            @color/widget_picker_unselected_tab_text_color_light</item>
+        <item name="widgetPickerCollapseHandleColor">
+            @color/widget_picker_collapse_handle_color_light</item>
     </style>
     <style name="WidgetContainerTheme.Dark" parent="AppTheme.Dark">
         <item name="android:colorEdgeEffect">?android:attr/textColorSecondary</item>
         <item name="android:colorPrimaryDark">#616161</item> <!-- Gray 700 -->
-        <item name="widgetPickerHeaderAppTitleColor">@color/app_title_text_dark</item>
-        <item name="widgetPickerHeaderAppSubtitleColor">@color/app_subtitle_text_dark</item>
+        <item name="widgetPickerPrimarySurfaceColor">
+            @color/widget_picker_primary_surface_color_dark</item>
+        <item name="widgetPickerSecondarySurfaceColor">
+            @color/widget_picker_secondary_surface_color_dark</item>
+        <item name="widgetPickerTitleColor">
+            @color/widget_picker_title_color_dark</item>
+        <item name="widgetPickerHeaderAppTitleColor">
+            @color/widget_picker_header_app_title_color_dark</item>
+        <item name="widgetPickerHeaderAppSubtitleColor">
+            @color/widget_picker_header_app_subtitle_color_dark</item>
+        <item name="widgetPickerHeaderBackgroundColor">
+            @color/widget_picker_header_background_color_dark</item>
+        <item name="widgetPickerSuggestionsIconBackgroundColor">
+            @color/widget_picker_suggestions_icon_background_color_dark</item>
+        <item name="widgetPickerSuggestionsIconColor">
+            @color/widget_picker_suggestions_icon_color_dark</item>
+        <item name="widgetPickerSearchTextColor">@color/widget_picker_search_text_color_dark</item>
+        <item name="widgetPickerTabBackgroundSelected">
+            @color/widget_picker_tab_background_selected_dark</item>
+        <item name="widgetPickerTabBackgroundUnselected">
+            @color/widget_picker_tab_background_unselected_dark</item>
+        <item name="widgetPickerSelectedTabTextColor">
+            @color/widget_picker_selected_tab_text_color_dark</item>
+        <item name="widgetPickerUnselectedTabTextColor">
+            @color/widget_picker_unselected_tab_text_color_dark</item>
+        <item name="widgetPickerCollapseHandleColor">
+            @color/widget_picker_collapse_handle_color_dark</item>
     </style>
 
     <style name="FastScrollerPopup" parent="@android:style/TextAppearance.DeviceDefault.DialogWindowTitle">