diff --git a/packages/SettingsLib/Android.bp b/packages/SettingsLib/Android.bp
index 7a5ea472b5326..1b7298a332ded 100644
--- a/packages/SettingsLib/Android.bp
+++ b/packages/SettingsLib/Android.bp
@@ -19,6 +19,7 @@ android_library {
         "androidx.appcompat_appcompat",
         "androidx.lifecycle_lifecycle-runtime",
         "androidx.mediarouter_mediarouter-nodeps",
+        "com.google.android.material_material",
         "iconloader",
 
         "WifiTrackerLibRes",
diff --git a/packages/SettingsLib/SettingsTheme/res/values-night-v31/colors.xml b/packages/SettingsLib/SettingsTheme/res/values-night-v31/colors.xml
index 77c4533b9f463..5e3907caf8608 100644
--- a/packages/SettingsLib/SettingsTheme/res/values-night-v31/colors.xml
+++ b/packages/SettingsLib/SettingsTheme/res/values-night-v31/colors.xml
@@ -31,7 +31,7 @@
     <!-- Dialog accent color -->
     <color name="settingslib_dialog_accent">@android:color/system_accent1_100</color>
     <!-- Dialog background color. -->
-    <color name="settingslib_dialog_background">@android:color/system_neutral1_800</color>
+    <color name="settingslib_dialog_background">@color/settingslib_surface_dark</color>
     <!-- Dialog error color. -->
     <color name="settingslib_dialog_colorError">#f28b82</color> <!-- Red 300 -->
 
@@ -49,4 +49,8 @@
     <color name="settingslib_text_color_preference_category_title">@android:color/system_accent1_100</color>
 
     <color name="settingslib_ripple_color">@color/settingslib_material_grey_900</color>
+
+    <color name="settingslib_surface_dark">@android:color/system_neutral1_800</color>
+
+    <color name="settingslib_colorSurface">@color/settingslib_surface_dark</color>
 </resources>
\ No newline at end of file
diff --git a/packages/SettingsLib/SettingsTheme/res/values-v31/colors.xml b/packages/SettingsLib/SettingsTheme/res/values-v31/colors.xml
index 6adb7899fcc50..c4dbc5edbe79b 100644
--- a/packages/SettingsLib/SettingsTheme/res/values-v31/colors.xml
+++ b/packages/SettingsLib/SettingsTheme/res/values-v31/colors.xml
@@ -71,5 +71,12 @@
     <color name="settingslib_text_color_preference_category_title">@android:color/system_accent1_600</color>
 
     <color name="settingslib_ripple_color">?android:attr/colorControlHighlight</color>
+
     <color name="settingslib_material_grey_900">#ff212121</color>
+
+    <color name="settingslib_colorAccentPrimary">@color/settingslib_accent_primary_device_default</color>
+
+    <color name="settingslib_colorAccentSecondary">@color/settingslib_accent_secondary_device_default</color>
+
+    <color name="settingslib_colorSurface">@color/settingslib_surface_light</color>
 </resources>
diff --git a/packages/SettingsLib/res/color-night-v31/settingslib_tabs_indicator_color.xml b/packages/SettingsLib/res/color-night-v31/settingslib_tabs_indicator_color.xml
new file mode 100644
index 0000000000000..9a093601a92ca
--- /dev/null
+++ b/packages/SettingsLib/res/color-night-v31/settingslib_tabs_indicator_color.xml
@@ -0,0 +1,19 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+     Copyright (C) 2022 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="@color/settingslib_colorAccentSecondary" />
+</selector>
\ No newline at end of file
diff --git a/packages/SettingsLib/res/color-night-v31/settingslib_tabs_text_color.xml b/packages/SettingsLib/res/color-night-v31/settingslib_tabs_text_color.xml
new file mode 100644
index 0000000000000..33f96df8d5b5b
--- /dev/null
+++ b/packages/SettingsLib/res/color-night-v31/settingslib_tabs_text_color.xml
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+     Copyright (C) 2022 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:state_selected="true" android:color="?android:attr/textColorPrimaryInverse"/>
+    <item android:state_enabled="false" android:color="?android:attr/textColorTertiary"/>
+    <item android:color="?android:attr/textColorSecondary"/>
+</selector>
\ No newline at end of file
diff --git a/packages/SettingsLib/res/color-v31/settingslib_tabs_indicator_color.xml b/packages/SettingsLib/res/color-v31/settingslib_tabs_indicator_color.xml
new file mode 100644
index 0000000000000..57fef52f15bd9
--- /dev/null
+++ b/packages/SettingsLib/res/color-v31/settingslib_tabs_indicator_color.xml
@@ -0,0 +1,19 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+     Copyright (C) 2022 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="@color/settingslib_colorAccentPrimary" />
+</selector>
\ No newline at end of file
diff --git a/packages/SettingsLib/res/color-v31/settingslib_tabs_text_color.xml b/packages/SettingsLib/res/color-v31/settingslib_tabs_text_color.xml
new file mode 100644
index 0000000000000..df2346d7175e9
--- /dev/null
+++ b/packages/SettingsLib/res/color-v31/settingslib_tabs_text_color.xml
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+     Copyright (C) 2022 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:state_selected="true" android:color="?android:attr/textColorPrimary"/>
+    <item android:state_enabled="false" android:color="?android:attr/textColorTertiary"/>
+    <item android:color="?android:attr/textColorSecondary"/>
+</selector>
\ No newline at end of file
diff --git a/packages/SettingsLib/res/drawable-v31/settingslib_tabs_background.xml b/packages/SettingsLib/res/drawable-v31/settingslib_tabs_background.xml
new file mode 100644
index 0000000000000..f10b56315546a
--- /dev/null
+++ b/packages/SettingsLib/res/drawable-v31/settingslib_tabs_background.xml
@@ -0,0 +1,40 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+     Copyright (C) 2022 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="?android:colorControlHighlight">
+    <item android:id="@android:id/mask">
+        <inset
+            android:insetLeft="4dp"
+            android:insetRight="4dp">
+            <shape android:shape="rectangle">
+                <corners android:radius="12dp" />
+                <solid android:color="?android:colorControlHighlight" />
+            </shape>
+        </inset>
+    </item>
+
+    <item android:id="@android:id/background">
+        <inset
+               android:insetLeft="4dp"
+               android:insetRight="4dp">
+            <shape android:shape="rectangle">
+                <solid android:color="@color/settingslib_colorSurface" />
+                <corners android:radius="12dp" />
+            </shape>
+        </inset>
+    </item>
+</ripple>
diff --git a/packages/SettingsLib/res/drawable-v31/settingslib_tabs_indicator_background.xml b/packages/SettingsLib/res/drawable-v31/settingslib_tabs_indicator_background.xml
new file mode 100644
index 0000000000000..f5a97825870c7
--- /dev/null
+++ b/packages/SettingsLib/res/drawable-v31/settingslib_tabs_indicator_background.xml
@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+     Copyright (C) 2022 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.
+-->
+<inset xmlns:android="http://schemas.android.com/apk/res/android"
+       android:insetLeft="4dp"
+       android:insetRight="4dp">
+    <shape android:shape="rectangle">
+        <solid android:color="@color/settingslib_tabs_indicator_color" />
+        <corners android:radius="12dp" />
+    </shape>
+</inset>
\ No newline at end of file
diff --git a/packages/SettingsLib/res/values-v31/styles.xml b/packages/SettingsLib/res/values-v31/styles.xml
new file mode 100644
index 0000000000000..343de2cdf47a7
--- /dev/null
+++ b/packages/SettingsLib/res/values-v31/styles.xml
@@ -0,0 +1,39 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+  Copyright (C) 2022 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.
+  -->
+<resources>
+    <style name="SettingsLibTabsTextAppearance" parent="@android:style/TextAppearance.DeviceDefault.Widget.ActionBar.Title">
+        <item name="android:textSize">16sp</item>
+    </style>
+
+    <style name="SettingsLibTabsStyle" parent="Base.Widget.Design.TabLayout">
+        <item name="android:background">@android:color/transparent</item>
+        <item name="android:layout_width">match_parent</item>
+        <item name="android:layout_height">48dp</item>
+        <item name="android:layout_marginStart">?android:attr/listPreferredItemPaddingStart</item>
+        <item name="android:layout_marginEnd">?android:attr/listPreferredItemPaddingEnd</item>
+        <item name="tabGravity">fill</item>
+        <item name="tabBackground">@drawable/settingslib_tabs_background</item>
+        <item name="tabIndicator">@drawable/settingslib_tabs_indicator_background</item>
+        <item name="tabIndicatorColor">@color/settingslib_tabs_indicator_color</item>
+        <item name="tabIndicatorFullWidth">true</item>
+        <item name="tabIndicatorGravity">stretch</item>
+        <item name="tabIndicatorAnimationMode">fade</item>
+        <item name="tabIndicatorAnimationDuration">0</item>
+        <item name="tabTextAppearance">@style/SettingsLibTabsTextAppearance</item>
+        <item name="tabTextColor">@color/settingslib_tabs_text_color</item>
+    </style>
+</resources>
\ No newline at end of file