diff --git a/res/drawable/clock_font_apply.xml b/res/drawable/clock_font_apply.xml
new file mode 100644
index 0000000..11c6f06
--- /dev/null
+++ b/res/drawable/clock_font_apply.xml
@@ -0,0 +1,24 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="72dp"
+    android:height="56dp"
+    android:viewportWidth="72"
+    android:viewportHeight="56">
+  <group>
+    <clip-path
+        android:pathData="M0,0h72v56h-72z"/>
+    <group>
+      <clip-path
+          android:pathData="M0,28C0,12.536 12.536,0 28,0H44C59.464,0 72,12.536 72,28C72,43.464 59.464,56 44,56H28C12.536,56 0,43.464 0,28Z"/>
+      <path
+          android:pathData="M0,28C0,12.536 12.536,0 28,0H44C59.464,0 72,12.536 72,28C72,43.464 59.464,56 44,56H28C12.536,56 0,43.464 0,28Z"
+          android:fillColor="@color/system_on_primary"/>
+      <group>
+        <clip-path
+            android:pathData="M24,16h24v24h-24z"/>
+        <path
+            android:pathData="M33.55,34L27.85,28.3L29.275,26.875L33.55,31.15L42.725,21.975L44.15,23.4L33.55,34Z"
+            android:fillColor="@color/system_primary"/>
+      </group>
+    </group>
+  </group>
+</vector>
diff --git a/res/drawable/clock_font_revert.xml b/res/drawable/clock_font_revert.xml
new file mode 100644
index 0000000..10a46ad
--- /dev/null
+++ b/res/drawable/clock_font_revert.xml
@@ -0,0 +1,24 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="72dp"
+    android:height="56dp"
+    android:viewportWidth="72"
+    android:viewportHeight="56">
+  <group>
+    <clip-path
+        android:pathData="M0,0h72v56h-72z"/>
+    <group>
+      <clip-path
+          android:pathData="M0,28C0,12.536 12.536,0 28,0H44C59.464,0 72,12.536 72,28C72,43.464 59.464,56 44,56H28C12.536,56 0,43.464 0,28Z"/>
+      <path
+          android:pathData="M0,28C0,12.536 12.536,0 28,0H44C59.464,0 72,12.536 72,28C72,43.464 59.464,56 44,56H28C12.536,56 0,43.464 0,28Z"
+          android:fillColor="@color/system_secondary_container"/>
+      <group>
+        <clip-path
+            android:pathData="M24,16h24v24h-24z"/>
+        <path
+            android:pathData="M30.4,35L29,33.6L34.6,28L29,22.4L30.4,21L36,26.6L41.6,21L43,22.4L37.4,28L43,33.6L41.6,35L36,29.4L30.4,35Z"
+            android:fillColor="@color/system_on_secondary_container"/>
+      </group>
+    </group>
+  </group>
+</vector>
diff --git a/res/drawable/clock_font_switch_divider.xml b/res/drawable/clock_font_switch_divider.xml
new file mode 100644
index 0000000..abaee24
--- /dev/null
+++ b/res/drawable/clock_font_switch_divider.xml
@@ -0,0 +1,25 @@
+<!--
+  ~ Copyright (C) 2024 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.
+  -->
+
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="6dp"
+    android:height="48dp"
+    android:viewportWidth="6"
+    android:viewportHeight="48">
+  <path
+      android:pathData="M2,11C2,10.448 2.448,10 3,10C3.552,10 4,10.448 4,11V37C4,37.552 3.552,38 3,38C2.448,38 2,37.552 2,37V11Z"
+      android:fillColor="@color/system_outline"/>
+</vector>
diff --git a/res/layout/clock_font_axis_name.xml b/res/layout/clock_font_axis_name.xml
new file mode 100644
index 0000000..dd29c6b
--- /dev/null
+++ b/res/layout/clock_font_axis_name.xml
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="utf-8"?><!--
+  ~ Copyright (C) 2024 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.
+  -->
+
+<TextView xmlns:android="http://schemas.android.com/apk/res/android"
+    android:id="@+id/clock_axis_name"
+    android:layout_width="@dimen/clock_font_axis_name_width"
+    android:layout_height="wrap_content"
+    android:layout_gravity="center_vertical" />
\ No newline at end of file
diff --git a/res/layout/clock_font_axis_slider_row.xml b/res/layout/clock_font_axis_slider_row.xml
new file mode 100644
index 0000000..cb663b4
--- /dev/null
+++ b/res/layout/clock_font_axis_slider_row.xml
@@ -0,0 +1,35 @@
+<?xml version="1.0" encoding="utf-8"?><!--
+  ~ Copyright (C) 2024 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.
+  -->
+
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    android:paddingVertical="@dimen/clock_axis_control_row_vertical_padding"
+    android:orientation="horizontal">
+    <include layout="@layout/clock_font_axis_name" />
+
+    <SeekBar
+        android:id="@+id/clock_axis_slider"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:layout_gravity="center_vertical"
+        android:paddingStart="@dimen/clock_axis_control_padding_start"
+        android:minHeight="@dimen/touch_target_min_height"
+        android:thumb="@null"
+        android:background="@null"
+        android:splitTrack="false"
+        android:progressDrawable="@drawable/saturation_progress_drawable" />
+</LinearLayout>
\ No newline at end of file
diff --git a/res/layout/clock_font_axis_switch.xml b/res/layout/clock_font_axis_switch.xml
new file mode 100644
index 0000000..385d105
--- /dev/null
+++ b/res/layout/clock_font_axis_switch.xml
@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="utf-8"?><!--
+  ~ Copyright (C) 2024 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.
+  -->
+
+<Switch xmlns:android="http://schemas.android.com/apk/res/android"
+    android:id="@+id/clock_axis_switch"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    android:paddingStart="@dimen/clock_axis_control_padding_start"
+    style="@style/Switch.SettingsLib" />
\ No newline at end of file
diff --git a/res/layout/clock_font_axis_switch_row.xml b/res/layout/clock_font_axis_switch_row.xml
new file mode 100644
index 0000000..139e5e0
--- /dev/null
+++ b/res/layout/clock_font_axis_switch_row.xml
@@ -0,0 +1,49 @@
+<?xml version="1.0" encoding="utf-8"?><!--
+  ~ Copyright (C) 2024 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.
+  -->
+
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    android:paddingVertical="@dimen/clock_axis_control_row_vertical_padding"
+    android:orientation="horizontal">
+    <LinearLayout
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:id="@+id/clock_switch_one"
+        android:orientation="horizontal">
+
+        <include layout="@layout/clock_font_axis_name" />
+        <include layout="@layout/clock_font_axis_switch" />
+    </LinearLayout>
+
+    <LinearLayout
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:id="@+id/clock_switch_two"
+        android:orientation="horizontal"
+        android:visibility="gone">
+
+        <ImageView
+            android:layout_height="wrap_content"
+            android:layout_width="wrap_content"
+            android:src="@drawable/clock_font_switch_divider"
+            android:layout_marginHorizontal="@dimen/clock_font_control_switch_padding_horizontal"
+            android:layout_gravity="center_vertical"/>
+
+        <include layout="@layout/clock_font_axis_name" />
+        <include layout="@layout/clock_font_axis_switch" />
+    </LinearLayout>
+</LinearLayout>
\ No newline at end of file
diff --git a/res/layout/floating_sheet_clock.xml b/res/layout/floating_sheet_clock.xml
index 7ff663f..75afce6 100644
--- a/res/layout/floating_sheet_clock.xml
+++ b/res/layout/floating_sheet_clock.xml
@@ -148,7 +148,6 @@
                     android:clipToPadding="false" />
             </FrameLayout>
 
-
             <SeekBar
                 android:id="@+id/clock_color_slider"
                 android:layout_width="match_parent"
@@ -162,6 +161,19 @@
                 android:progressDrawable="@drawable/saturation_progress_drawable"
                 android:splitTrack="false" />
         </LinearLayout>
+
+        <LinearLayout
+            android:id="@+id/clock_floating_sheet_font_content"
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:paddingHorizontal="@dimen/floating_sheet_content_horizontal_padding"
+            android:paddingVertical="@dimen/floating_sheet_content_vertical_padding"
+            android:orientation="vertical"
+            android:clipToPadding="false"
+            android:clipChildren="false">
+
+            <!-- Populated dynamically w/ clock axis information -->
+        </LinearLayout>
     </FrameLayout>
 
     <com.android.wallpaper.picker.customization.ui.view.FloatingToolbar
@@ -170,4 +182,27 @@
         android:layout_height="wrap_content"
         android:layout_gravity="center_horizontal"
         android:layout_marginVertical="@dimen/floating_sheet_tab_toolbar_vertical_margin" />
+
+    <LinearLayout
+        android:id="@+id/clock_font_toolbar"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:orientation="horizontal"
+        android:layout_gravity="center_horizontal"
+        android:layout_marginVertical="@dimen/floating_sheet_tab_toolbar_vertical_margin">
+
+        <ImageView
+            android:id="@+id/clock_font_revert"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:src="@drawable/clock_font_revert"
+            android:contentDescription="@string/clock_font_editor_revert" />
+        <ImageView
+            android:id="@+id/clock_font_apply"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:paddingStart="@dimen/clock_font_apply_padding_start"
+            android:src="@drawable/clock_font_apply"
+            android:contentDescription="@string/clock_font_editor_apply" />
+    </LinearLayout>
 </LinearLayout>
diff --git a/res/values/dimens.xml b/res/values/dimens.xml
index c242fe9..d8d30d3 100644
--- a/res/values/dimens.xml
+++ b/res/values/dimens.xml
@@ -194,4 +194,11 @@
     <dimen name="floating_sheet_color_option_size">54dp</dimen>
     <dimen name="floating_sheet_color_option_stroke_width">3dp</dimen>
     <dimen name="customization_option_entry_shortcut_icon_size">20dp</dimen>
+
+    <!-- Clock font control dimensions -->
+    <dimen name="clock_font_axis_name_width">64dp</dimen>
+    <dimen name="clock_axis_control_padding_start">16dp</dimen>
+    <dimen name="clock_axis_control_row_vertical_padding">10dp</dimen>
+    <dimen name="clock_font_control_switch_padding_horizontal">38dp</dimen>
+    <dimen name="clock_font_apply_padding_start">8dp</dimen>
 </resources>
diff --git a/res/values/strings.xml b/res/values/strings.xml
index 5643351..586117f 100755
--- a/res/values/strings.xml
+++ b/res/values/strings.xml
@@ -96,6 +96,12 @@
     <!-- Description of a radio button to apply clock size small. [CHAR LIMIT=NONE] -->
     <string name="clock_size_small_description">A small clock shows in the corner of your screen</string>
 
+    <!-- Description for clock font editor axis apply button. [CHAR LIMIT=NONE] -->
+    <string name="clock_font_editor_apply">Apply clock font changes</string>
+
+    <!-- Description for clock font editor axis revert button. [CHAR LIMIT=NONE] -->
+    <string name="clock_font_editor_revert">Undo clock font changes</string>
+
     <!-- Title of a section of the customization picker where the user can select a Grid size for
         the home screen. [CHAR LIMIT=15] -->
     <string name="grid_title">App grid</string>
diff --git a/src/com/android/customization/model/grid/DefaultShapeGridManager.kt b/src/com/android/customization/model/grid/DefaultShapeGridManager.kt
index f0d9efa..8de5ff2 100644
--- a/src/com/android/customization/model/grid/DefaultShapeGridManager.kt
+++ b/src/com/android/customization/model/grid/DefaultShapeGridManager.kt
@@ -39,91 +39,56 @@
         context.getString(R.string.grid_control_metadata_name)
     private val previewUtils: PreviewUtils = PreviewUtils(context, authorityMetadataKey)
 
+    override suspend fun isGridOptionAvailable(): Boolean {
+        return previewUtils.supportsPreview() && (getGridOptions()?.size ?: 0) > 1
+    }
+
     override suspend fun getGridOptions(): List<GridOptionModel>? =
         withContext(bgDispatcher) {
-            if (previewUtils.supportsPreview()) {
-                context.contentResolver
-                    .query(previewUtils.getUri(GRID_OPTIONS), null, null, null, null)
-                    ?.use { cursor ->
-                        buildList {
-                            while (cursor.moveToNext()) {
-                                val rows = cursor.getInt(cursor.getColumnIndex(COL_ROWS))
-                                val cols = cursor.getInt(cursor.getColumnIndex(COL_COLS))
-                                add(
-                                    GridOptionModel(
-                                        key = cursor.getString(cursor.getColumnIndex(COL_GRID_KEY)),
-                                        title =
-                                            context.getString(
-                                                com.android.themepicker.R.string.grid_title_pattern,
-                                                cols,
-                                                rows,
-                                            ),
-                                        isCurrent =
-                                            cursor
-                                                .getString(cursor.getColumnIndex(COL_IS_DEFAULT))
-                                                .toBoolean(),
-                                        rows = rows,
-                                        cols = cols,
-                                    )
+            context.contentResolver
+                .query(previewUtils.getUri(LIST_OPTIONS), null, null, null, null)
+                ?.use { cursor ->
+                    buildList {
+                        while (cursor.moveToNext()) {
+                            val rows = cursor.getInt(cursor.getColumnIndex(COL_ROWS))
+                            val cols = cursor.getInt(cursor.getColumnIndex(COL_COLS))
+                            add(
+                                GridOptionModel(
+                                    key = cursor.getString(cursor.getColumnIndex(COL_NAME)),
+                                    title =
+                                        context.getString(
+                                            com.android.themepicker.R.string.grid_title_pattern,
+                                            cols,
+                                            rows,
+                                        ),
+                                    isCurrent =
+                                        cursor
+                                            .getString(cursor.getColumnIndex(COL_IS_DEFAULT))
+                                            .toBoolean(),
+                                    rows = rows,
+                                    cols = cols,
                                 )
-                            }
+                            )
                         }
                     }
-            } else {
-                null
-            }
+                }
         }
 
-    override suspend fun getShapeOptions(): List<ShapeOptionModel>? =
-        withContext(bgDispatcher) {
-            if (previewUtils.supportsPreview()) {
-                context.contentResolver
-                    .query(previewUtils.getUri(SHAPE_OPTIONS), null, null, null, null)
-                    ?.use { cursor ->
-                        buildList {
-                            while (cursor.moveToNext()) {
-                                add(
-                                    ShapeOptionModel(
-                                        key =
-                                            cursor.getString(cursor.getColumnIndex(COL_SHAPE_KEY)),
-                                        title = cursor.getString(cursor.getColumnIndex(COL_TITLE)),
-                                        path = cursor.getString(cursor.getColumnIndex(COL_PATH)),
-                                        isCurrent =
-                                            cursor
-                                                .getString(cursor.getColumnIndex(COL_IS_DEFAULT))
-                                                .toBoolean(),
-                                    )
-                                )
-                            }
-                        }
-                    }
-            } else {
-                null
-            }
-        }
-
-    override fun applyShapeGridOption(shapeKey: String, gridKey: String): Int {
+    override fun applyGridOption(gridName: String): Int {
         return context.contentResolver.update(
-            previewUtils.getUri(SHAPE_GRID),
-            ContentValues().apply {
-                put(COL_SHAPE_KEY, shapeKey)
-                put(COL_GRID_KEY, gridKey)
-            },
+            previewUtils.getUri(DEFAULT_GRID),
+            ContentValues().apply { put("name", gridName) },
             null,
             null,
         )
     }
 
     companion object {
-        const val SHAPE_OPTIONS: String = "shape_options"
-        const val GRID_OPTIONS: String = "grid_options"
-        const val SHAPE_GRID: String = "default_grid"
-        const val COL_SHAPE_KEY: String = "shape_key"
-        const val COL_GRID_KEY: String = "name"
+        const val LIST_OPTIONS: String = "list_options"
+        const val DEFAULT_GRID: String = "default_grid"
+        const val COL_NAME: String = "name"
         const val COL_ROWS: String = "rows"
         const val COL_COLS: String = "cols"
         const val COL_IS_DEFAULT: String = "is_default"
-        const val COL_TITLE: String = "title"
-        const val COL_PATH: String = "path"
     }
 }
diff --git a/src/com/android/customization/model/grid/ShapeGridManager.kt b/src/com/android/customization/model/grid/ShapeGridManager.kt
index 0a23346..1603ed9 100644
--- a/src/com/android/customization/model/grid/ShapeGridManager.kt
+++ b/src/com/android/customization/model/grid/ShapeGridManager.kt
@@ -18,9 +18,9 @@
 
 interface ShapeGridManager {
 
+    suspend fun isGridOptionAvailable(): Boolean
+
     suspend fun getGridOptions(): List<GridOptionModel>?
 
-    suspend fun getShapeOptions(): List<ShapeOptionModel>?
-
-    fun applyShapeGridOption(shapeKey: String, gridKey: String): Int
+    fun applyGridOption(gridName: String): Int
 }
diff --git a/src/com/android/customization/model/grid/ShapeOptionModel.kt b/src/com/android/customization/model/grid/ShapeOptionModel.kt
deleted file mode 100644
index c3ed192..0000000
--- a/src/com/android/customization/model/grid/ShapeOptionModel.kt
+++ /dev/null
@@ -1,24 +0,0 @@
-/*
- * Copyright (C) 2024 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.
- */
-
-package com.android.customization.model.grid
-
-data class ShapeOptionModel(
-    val key: String,
-    val title: String,
-    val path: String,
-    val isCurrent: Boolean,
-)
diff --git a/src/com/android/customization/picker/clock/data/repository/ClockPickerRepositoryImpl.kt b/src/com/android/customization/picker/clock/data/repository/ClockPickerRepositoryImpl.kt
index f3a2301..86920a3 100644
--- a/src/com/android/customization/picker/clock/data/repository/ClockPickerRepositoryImpl.kt
+++ b/src/com/android/customization/picker/clock/data/repository/ClockPickerRepositoryImpl.kt
@@ -22,6 +22,7 @@
 import androidx.annotation.IntRange
 import com.android.customization.picker.clock.shared.ClockSize
 import com.android.customization.picker.clock.shared.model.ClockMetadataModel
+import com.android.systemui.plugins.clocks.ClockFontAxis
 import com.android.systemui.plugins.clocks.ClockMetadata
 import com.android.systemui.shared.clocks.ClockRegistry
 import com.android.systemui.shared.settings.data.repository.SecureSettingsRepository
@@ -70,7 +71,7 @@
                                     description = clockConfig.description,
                                     thumbnail = clockConfig.thumbnail,
                                     isReactiveToTone = clockConfig.isReactiveToTone,
-                                    hasReactiveAxes = !clockConfig.axes.isEmpty(),
+                                    axes = clockConfig.axes,
                                 )
                             } else {
                                 null
@@ -116,7 +117,7 @@
                                     description = it.description,
                                     thumbnail = it.thumbnail,
                                     isReactiveToTone = it.isReactiveToTone,
-                                    hasReactiveAxes = !it.axes.isEmpty(),
+                                    axes = it.axes,
                                     selectedColorId = metadata?.getSelectedColorId(),
                                     colorTone =
                                         metadata?.getColorTone()
@@ -206,7 +207,7 @@
         description: String,
         thumbnail: Drawable,
         isReactiveToTone: Boolean,
-        hasReactiveAxes: Boolean,
+        axes: List<ClockFontAxis>,
         selectedColorId: String? = null,
         @IntRange(from = 0, to = 100) colorTone: Int = 0,
         @ColorInt seedColor: Int? = null,
@@ -217,7 +218,7 @@
             description = description,
             thumbnail = thumbnail,
             isReactiveToTone = isReactiveToTone,
-            hasReactiveAxes = hasReactiveAxes,
+            axes = axes,
             selectedColorId = selectedColorId,
             colorToneProgress = colorTone,
             seedColor = seedColor,
diff --git a/src/com/android/customization/picker/clock/shared/model/ClockMetadataModel.kt b/src/com/android/customization/picker/clock/shared/model/ClockMetadataModel.kt
index ff8d85f..dfedb5d 100644
--- a/src/com/android/customization/picker/clock/shared/model/ClockMetadataModel.kt
+++ b/src/com/android/customization/picker/clock/shared/model/ClockMetadataModel.kt
@@ -20,6 +20,7 @@
 import android.graphics.drawable.Drawable
 import androidx.annotation.ColorInt
 import androidx.annotation.IntRange
+import com.android.systemui.plugins.clocks.ClockFontAxis
 
 /** Model for clock metadata. */
 data class ClockMetadataModel(
@@ -28,7 +29,7 @@
     val description: String,
     val thumbnail: Drawable,
     val isReactiveToTone: Boolean,
-    val hasReactiveAxes: Boolean,
+    val axes: List<ClockFontAxis>,
     val selectedColorId: String?,
     @IntRange(from = 0, to = 100) val colorToneProgress: Int,
     @ColorInt val seedColor: Int?,
diff --git a/src/com/android/customization/picker/clock/ui/view/ThemePickerClockViewFactory.kt b/src/com/android/customization/picker/clock/ui/view/ThemePickerClockViewFactory.kt
index b68edd9..09da12a 100644
--- a/src/com/android/customization/picker/clock/ui/view/ThemePickerClockViewFactory.kt
+++ b/src/com/android/customization/picker/clock/ui/view/ThemePickerClockViewFactory.kt
@@ -26,6 +26,7 @@
 import androidx.lifecycle.LifecycleOwner
 import com.android.internal.policy.SystemBarUtils
 import com.android.systemui.plugins.clocks.ClockController
+import com.android.systemui.plugins.clocks.ClockFontAxisSetting
 import com.android.systemui.plugins.clocks.WeatherData
 import com.android.systemui.shared.clocks.ClockRegistry
 import com.android.wallpaper.config.BaseFlags
@@ -135,6 +136,10 @@
         }
     }
 
+    override fun updateFontAxes(clockId: String, settings: List<ClockFontAxisSetting>) {
+        getController(clockId).let { it.events.onFontAxesChanged(settings) }
+    }
+
     override fun updateRegionDarkness() {
         val isRegionDark = isLockscreenWallpaperDark()
         clockControllers.values.forEach {
diff --git a/src/com/android/customization/picker/grid/data/repository/ShapeGridRepository.kt b/src/com/android/customization/picker/grid/data/repository/ShapeGridRepository.kt
index 86c455e..9ae4d18 100644
--- a/src/com/android/customization/picker/grid/data/repository/ShapeGridRepository.kt
+++ b/src/com/android/customization/picker/grid/data/repository/ShapeGridRepository.kt
@@ -19,7 +19,6 @@
 
 import com.android.customization.model.grid.GridOptionModel
 import com.android.customization.model.grid.ShapeGridManager
-import com.android.customization.model.grid.ShapeOptionModel
 import com.android.wallpaper.picker.di.modules.BackgroundDispatcher
 import javax.inject.Inject
 import javax.inject.Singleton
@@ -42,31 +41,27 @@
     @BackgroundDispatcher private val bgDispatcher: CoroutineDispatcher,
 ) {
 
-    private val _shapeOptions = MutableStateFlow<List<ShapeOptionModel>?>(null)
+    suspend fun isGridOptionAvailable(): Boolean =
+        withContext(bgDispatcher) { manager.isGridOptionAvailable() }
+
     private val _gridOptions = MutableStateFlow<List<GridOptionModel>?>(null)
 
     init {
         bgScope.launch {
-            _gridOptions.value = manager.getGridOptions()
-            _shapeOptions.value = manager.getShapeOptions()
+            val options = manager.getGridOptions()
+            _gridOptions.value = options
         }
     }
 
-    val shapeOptions: StateFlow<List<ShapeOptionModel>?> = _shapeOptions.asStateFlow()
-
-    val selectedShapeOption: Flow<ShapeOptionModel?> =
-        shapeOptions.map { shapeOptions -> shapeOptions?.firstOrNull { it.isCurrent } }
-
     val gridOptions: StateFlow<List<GridOptionModel>?> = _gridOptions.asStateFlow()
 
     val selectedGridOption: Flow<GridOptionModel?> =
         gridOptions.map { gridOptions -> gridOptions?.firstOrNull { it.isCurrent } }
 
-    suspend fun applySelectedOption(shapeKey: String, gridKey: String) =
+    suspend fun applySelectedOption(key: String) =
         withContext(bgDispatcher) {
-            manager.applyShapeGridOption(shapeKey, gridKey)
-            // After applying, we should query and update shape and grid options again.
+            manager.applyGridOption(key)
+            // After applying new grid option, we should query and update the grid options again.
             _gridOptions.value = manager.getGridOptions()
-            _shapeOptions.value = manager.getShapeOptions()
         }
 }
diff --git a/src/com/android/customization/picker/grid/domain/interactor/ShapeGridInteractor.kt b/src/com/android/customization/picker/grid/domain/interactor/ShapeGridInteractor.kt
index 8c4522e..c9c2b0c 100644
--- a/src/com/android/customization/picker/grid/domain/interactor/ShapeGridInteractor.kt
+++ b/src/com/android/customization/picker/grid/domain/interactor/ShapeGridInteractor.kt
@@ -23,15 +23,11 @@
 
 @Singleton
 class ShapeGridInteractor @Inject constructor(private val repository: ShapeGridRepository) {
-
-    val shapeOptions = repository.shapeOptions
-
-    val selectedShapeOption = repository.selectedShapeOption
+    suspend fun isGridOptionAvailable(): Boolean = repository.isGridOptionAvailable()
 
     val gridOptions = repository.gridOptions
 
     val selectedGridOption = repository.selectedGridOption
 
-    suspend fun applySelectedOption(shapeKey: String, gridKey: String) =
-        repository.applySelectedOption(shapeKey, gridKey)
+    suspend fun applySelectedOption(key: String) = repository.applySelectedOption(key)
 }
diff --git a/src/com/android/wallpaper/customization/ui/binder/ClockFloatingSheetBinder.kt b/src/com/android/wallpaper/customization/ui/binder/ClockFloatingSheetBinder.kt
index 983b897..3423617 100644
--- a/src/com/android/wallpaper/customization/ui/binder/ClockFloatingSheetBinder.kt
+++ b/src/com/android/wallpaper/customization/ui/binder/ClockFloatingSheetBinder.kt
@@ -19,11 +19,13 @@
 import android.animation.ValueAnimator
 import android.content.Context
 import android.content.res.Configuration
+import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
 import android.widget.ImageView
 import android.widget.SeekBar
 import android.widget.Switch
+import android.widget.TextView
 import androidx.core.view.doOnLayout
 import androidx.core.view.isVisible
 import androidx.lifecycle.Lifecycle
@@ -37,18 +39,22 @@
 import com.android.customization.picker.color.ui.view.ColorOptionIconView
 import com.android.customization.picker.color.ui.viewmodel.ColorOptionIconViewModel
 import com.android.customization.picker.common.ui.view.SingleRowListItemSpacing
+import com.android.systemui.plugins.clocks.AxisType
+import com.android.systemui.plugins.clocks.ClockFontAxis
+import com.android.systemui.plugins.clocks.ClockId
 import com.android.themepicker.R
 import com.android.wallpaper.customization.ui.util.ThemePickerCustomizationOptionUtil.ThemePickerLockCustomizationOption.CLOCK
 import com.android.wallpaper.customization.ui.viewmodel.ClockFloatingSheetHeightsViewModel
+import com.android.wallpaper.customization.ui.viewmodel.ClockPickerViewModel
 import com.android.wallpaper.customization.ui.viewmodel.ClockPickerViewModel.ClockStyleModel
-import com.android.wallpaper.customization.ui.viewmodel.ClockPickerViewModel.Tab.COLOR
-import com.android.wallpaper.customization.ui.viewmodel.ClockPickerViewModel.Tab.STYLE
+import com.android.wallpaper.customization.ui.viewmodel.ClockPickerViewModel.Tab
 import com.android.wallpaper.customization.ui.viewmodel.ThemePickerCustomizationOptionsViewModel
 import com.android.wallpaper.picker.customization.ui.view.FloatingToolbar
 import com.android.wallpaper.picker.customization.ui.view.adapter.FloatingToolbarTabAdapter
 import com.android.wallpaper.picker.customization.ui.viewmodel.ColorUpdateViewModel
 import com.android.wallpaper.picker.option.ui.adapter.OptionItemAdapter
 import java.lang.ref.WeakReference
+import kotlin.math.abs
 import kotlinx.coroutines.flow.Flow
 import kotlinx.coroutines.flow.MutableStateFlow
 import kotlinx.coroutines.flow.asStateFlow
@@ -94,6 +100,17 @@
                 initStyleList(appContext, clockStyleAdapter)
             }
 
+        // Clock font editor
+        val clockFontContent =
+            view.requireViewById<ViewGroup>(R.id.clock_floating_sheet_font_content)
+        val clockFontToolbar = view.requireViewById<ViewGroup>(R.id.clock_font_toolbar)
+        clockFontToolbar
+            .requireViewById<View>(R.id.clock_font_revert)
+            .setOnClickListener(View.OnClickListener { viewModel.revertFontAxes() })
+        clockFontToolbar
+            .requireViewById<View>(R.id.clock_font_apply)
+            .setOnClickListener(View.OnClickListener { viewModel.applyFontAxes() })
+
         // Clock color
         val clockColorContent = view.requireViewById<View>(R.id.clock_floating_sheet_color_content)
         val clockColorAdapter =
@@ -126,6 +143,7 @@
                     ClockFloatingSheetHeightsViewModel(
                         clockStyleContentHeight = clockStyleContent.height,
                         clockColorContentHeight = clockColorContent.height,
+                        clockFontContentHeight = clockFontContent.height,
                     )
             }
         }
@@ -135,33 +153,69 @@
                 launch { viewModel.tabs.collect { tabAdapter.submitList(it) } }
 
                 launch {
-                    combine(clockFloatingSheetHeights, viewModel.selectedTab) { heights, selectedTab
-                            ->
-                            heights to selectedTab
+                    combine(clockFloatingSheetHeights, viewModel.selectedTab, ::Pair).collect {
+                        (heights, selectedTab) ->
+                        heights ?: return@collect
+
+                        val targetHeight =
+                            when (selectedTab) {
+                                Tab.STYLE -> heights.clockStyleContentHeight
+                                Tab.COLOR -> heights.clockColorContentHeight
+                                Tab.FONT -> heights.clockFontContentHeight
+                            } +
+                                view.resources.getDimensionPixelSize(
+                                    R.dimen.floating_sheet_content_vertical_padding
+                                ) * 2
+
+                        val animationFloatingSheet =
+                            ValueAnimator.ofInt(floatingSheetContainer.height, targetHeight)
+                        animationFloatingSheet.addUpdateListener { valueAnimator ->
+                            val value = valueAnimator.animatedValue as Int
+                            floatingSheetContainer.layoutParams =
+                                floatingSheetContainer.layoutParams.apply { height = value }
                         }
-                        .collect { (heights, selectedTab) ->
-                            heights ?: return@collect
-                            val targetHeight =
-                                when (selectedTab) {
-                                    STYLE -> heights.clockStyleContentHeight
-                                    COLOR -> heights.clockColorContentHeight
-                                } +
-                                    view.resources.getDimensionPixelSize(
-                                        R.dimen.floating_sheet_content_vertical_padding
-                                    ) * 2
+                        animationFloatingSheet.setDuration(ANIMATION_DURATION)
+                        animationFloatingSheet.start()
 
-                            val animationFloatingSheet =
-                                ValueAnimator.ofInt(floatingSheetContainer.height, targetHeight)
-                            animationFloatingSheet.addUpdateListener { valueAnimator ->
-                                val value = valueAnimator.animatedValue as Int
-                                floatingSheetContainer.layoutParams =
-                                    floatingSheetContainer.layoutParams.apply { height = value }
+                        clockStyleContent.isVisible = selectedTab == Tab.STYLE
+                        clockColorContent.isVisible = selectedTab == Tab.COLOR
+                        clockFontContent.isVisible = selectedTab == Tab.FONT
+
+                        tabs.isVisible = selectedTab != Tab.FONT
+                        clockFontToolbar.isVisible = selectedTab == Tab.FONT
+                    }
+                }
+
+                launch {
+                    var boundClockId: ClockId? = null
+                    var boundEditorViews = mapOf<String, Pair<View, ClockFontAxis>>()
+                    combine(viewModel.previewingClock, viewModel.previewingFontAxes, ::Pair)
+                        .collect { pair ->
+                            val (clock, axisSettings) = pair
+                            if (clock == null) {
+                                boundClockId = null
+                                boundEditorViews = mapOf()
+                                clockFontContent.removeAllViews()
+                                return@collect
                             }
-                            animationFloatingSheet.setDuration(ANIMATION_DURATION)
-                            animationFloatingSheet.start()
 
-                            clockStyleContent.isVisible = selectedTab == STYLE
-                            clockColorContent.isVisible = selectedTab == COLOR
+                            if (boundClockId != clock.clockId) {
+                                boundEditorViews =
+                                    initClockFontEditor(clockFontContent, clock.axes, viewModel)
+                                boundClockId = clock.clockId
+                            }
+
+                            for ((key, value) in axisSettings) {
+                                boundEditorViews[key]?.let { pair ->
+                                    val (view, axis) = pair
+                                    view.findViewById<Switch>(R.id.clock_axis_switch)?.apply {
+                                        isChecked = abs(value - axis.maxValue) < 0.01f
+                                    }
+                                    view.findViewById<SeekBar>(R.id.clock_axis_slider)?.apply {
+                                        setProgress(value.toInt(), false)
+                                    }
+                                }
+                            }
                         }
                 }
 
@@ -221,6 +275,76 @@
         }
     }
 
+    private fun initClockFontEditor(
+        parent: ViewGroup,
+        axes: List<ClockFontAxis>,
+        viewModel: ClockPickerViewModel,
+    ): Map<String, Pair<View, ClockFontAxis>> {
+        parent.removeAllViews()
+        val inflater = LayoutInflater.from(parent.context)
+        val axisMap = mutableMapOf<String, Pair<View, ClockFontAxis>>()
+        var nextSwitch: View? = null
+        for (axis in axes) {
+            val view =
+                when (axis.type) {
+                    AxisType.Float -> {
+                        val id = R.layout.clock_font_axis_slider_row
+                        val row = inflater.inflate(id, parent, false)
+                        parent.addView(row)
+                        row
+                    }
+                    AxisType.Boolean ->
+                        nextSwitch?.also { nextSwitch = null }
+                            ?: run {
+                                val id = R.layout.clock_font_axis_switch_row
+                                val row = inflater.inflate(id, parent, false)
+                                parent.addView(row)
+
+                                nextSwitch = row.requireViewById(R.id.clock_switch_two)
+                                row.requireViewById(R.id.clock_switch_one)
+                            }
+                }
+
+            view.visibility = View.VISIBLE
+            axisMap[axis.key] = Pair(view, axis)
+            view.contentDescription = axis.description
+            view.requireViewById<TextView>(R.id.clock_axis_name).text = axis.name
+
+            view.findViewById<Switch>(R.id.clock_axis_switch)?.apply {
+                isChecked = abs(axis.currentValue - axis.maxValue) < 0.01f
+                setOnCheckedChangeListener { v, _ ->
+                    val value = if (v.isChecked) axis.maxValue else axis.minValue
+                    viewModel.updatePreviewFontAxis(axis.key, value)
+                }
+            }
+
+            view.findViewById<SeekBar>(R.id.clock_axis_slider)?.apply {
+                setMax(axis.maxValue.toInt())
+                setMin(axis.minValue.toInt())
+                setProgress(axis.currentValue.toInt(), false)
+
+                setOnSeekBarChangeListener(
+                    object : SeekBar.OnSeekBarChangeListener {
+                        override fun onProgressChanged(
+                            seekBar: SeekBar?,
+                            progress: Int,
+                            fromUser: Boolean,
+                        ) {
+                            if (fromUser) {
+                                viewModel.updatePreviewFontAxis(axis.key, progress.toFloat())
+                            }
+                        }
+
+                        override fun onStartTrackingTouch(seekBar: SeekBar?) {}
+
+                        override fun onStopTrackingTouch(seekBar: SeekBar?) {}
+                    }
+                )
+            }
+        }
+        return axisMap
+    }
+
     private fun createClockStyleOptionItemAdapter(
         lifecycleOwner: LifecycleOwner
     ): OptionItemAdapter<ClockStyleModel> =
@@ -230,6 +354,7 @@
             bindIcon = { view: View, style: ClockStyleModel ->
                 (view.findViewById(R.id.clock_icon) as ImageView).setImageDrawable(style.thumbnail)
                 (view.findViewById(R.id.edit_icon) as ImageView).setVisibility(
+                    // TODO(b/364673969): Route isSelected here and hide when unselected
                     if (style.isEditable) View.VISIBLE else View.GONE
                 )
             },
diff --git a/src/com/android/wallpaper/customization/ui/binder/ThemePickerCustomizationOptionBinder.kt b/src/com/android/wallpaper/customization/ui/binder/ThemePickerCustomizationOptionBinder.kt
index a92471c..528c61a 100644
--- a/src/com/android/wallpaper/customization/ui/binder/ThemePickerCustomizationOptionBinder.kt
+++ b/src/com/android/wallpaper/customization/ui/binder/ThemePickerCustomizationOptionBinder.kt
@@ -30,6 +30,7 @@
 import com.android.customization.picker.clock.ui.view.ClockHostView2
 import com.android.customization.picker.clock.ui.view.ClockViewFactory
 import com.android.customization.picker.grid.ui.binder.GridIconViewBinder
+import com.android.systemui.plugins.clocks.ClockFontAxisSetting
 import com.android.themepicker.R
 import com.android.wallpaper.config.BaseFlags
 import com.android.wallpaper.customization.ui.util.ThemePickerCustomizationOptionUtil.ThemePickerHomeCustomizationOption
@@ -276,11 +277,15 @@
                     combine(
                             clockPickerViewModel.previewingSeedColor,
                             clockPickerViewModel.previewingClock,
-                        ) { color, clock ->
-                            color to clock
-                        }
-                        .collect { (color, clock) ->
+                            clockPickerViewModel.previewingFontAxes,
+                            ::Triple,
+                        )
+                        .collect { triple ->
+                            val (color, clock, axisMap) = triple
                             clockViewFactory.updateColor(clock.clockId, color)
+
+                            val axisList = axisMap.map { ClockFontAxisSetting(it.key, it.value) }
+                            clockViewFactory.updateFontAxes(clock.clockId, axisList)
                         }
                 }
             }
diff --git a/src/com/android/wallpaper/customization/ui/binder/ThemePickerToolbarBinder.kt b/src/com/android/wallpaper/customization/ui/binder/ThemePickerToolbarBinder.kt
index 91705dc..6282842 100644
--- a/src/com/android/wallpaper/customization/ui/binder/ThemePickerToolbarBinder.kt
+++ b/src/com/android/wallpaper/customization/ui/binder/ThemePickerToolbarBinder.kt
@@ -43,8 +43,16 @@
         applyButton: Button,
         viewModel: CustomizationOptionsViewModel,
         lifecycleOwner: LifecycleOwner,
+        onNavBack: () -> Unit,
     ) {
-        defaultToolbarBinder.bind(navButton, toolbar, applyButton, viewModel, lifecycleOwner)
+        defaultToolbarBinder.bind(
+            navButton,
+            toolbar,
+            applyButton,
+            viewModel,
+            lifecycleOwner,
+            onNavBack,
+        )
 
         if (viewModel !is ThemePickerCustomizationOptionsViewModel) {
             throw IllegalArgumentException(
@@ -56,7 +64,12 @@
             lifecycleOwner.repeatOnLifecycle(Lifecycle.State.STARTED) {
                 launch {
                     viewModel.onApplyButtonClicked.collect { onApplyButtonClicked ->
-                        applyButton.setOnClickListener { onApplyButtonClicked?.invoke() }
+                        applyButton.setOnClickListener {
+                            if (onApplyButtonClicked != null) {
+                                onApplyButtonClicked.invoke()
+                                onNavBack.invoke()
+                            }
+                        }
                     }
                 }
 
diff --git a/src/com/android/wallpaper/customization/ui/viewmodel/ClockFloatingSheetHeightsViewModel.kt b/src/com/android/wallpaper/customization/ui/viewmodel/ClockFloatingSheetHeightsViewModel.kt
index 913ff11..1f86533 100644
--- a/src/com/android/wallpaper/customization/ui/viewmodel/ClockFloatingSheetHeightsViewModel.kt
+++ b/src/com/android/wallpaper/customization/ui/viewmodel/ClockFloatingSheetHeightsViewModel.kt
@@ -19,4 +19,5 @@
 data class ClockFloatingSheetHeightsViewModel(
     val clockStyleContentHeight: Int,
     val clockColorContentHeight: Int,
+    val clockFontContentHeight: Int,
 )
diff --git a/src/com/android/wallpaper/customization/ui/viewmodel/ClockPickerViewModel.kt b/src/com/android/wallpaper/customization/ui/viewmodel/ClockPickerViewModel.kt
index 504b766..fe8a718 100644
--- a/src/com/android/wallpaper/customization/ui/viewmodel/ClockPickerViewModel.kt
+++ b/src/com/android/wallpaper/customization/ui/viewmodel/ClockPickerViewModel.kt
@@ -40,6 +40,7 @@
 import dagger.assisted.AssistedInject
 import dagger.hilt.android.qualifiers.ApplicationContext
 import dagger.hilt.android.scopes.ViewModelScoped
+import kotlin.collections.map
 import kotlinx.coroutines.CoroutineDispatcher
 import kotlinx.coroutines.CoroutineScope
 import kotlinx.coroutines.ExperimentalCoroutinesApi
@@ -72,6 +73,7 @@
     enum class Tab {
         STYLE,
         COLOR,
+        FONT,
     }
 
     private val colorMap = ClockColorViewModel.getPresetColorMap(context.resources)
@@ -137,7 +139,7 @@
                         payload =
                             ClockStyleModel(
                                 clockModel.thumbnail,
-                                isEditable = clockModel.hasReactiveAxes,
+                                isEditable = !clockModel.axes.isEmpty(),
                             ),
                         text = Text.Loaded(contentDescription),
                         isTextUserVisible = false,
@@ -145,9 +147,14 @@
                         onClicked =
                             isSelectedFlow.map { isSelected ->
                                 if (isSelected) {
-                                    null
+                                    fun() {
+                                        _selectedTab.value = Tab.FONT
+                                    }
                                 } else {
-                                    { overridingClock.value = clockModel }
+                                    fun() {
+                                        overridingClock.value = clockModel
+                                        overrideFontAxes.value = null
+                                    }
                                 }
                             },
                     )
@@ -159,6 +166,29 @@
             .flowOn(backgroundDispatcher.limitedParallelism(1))
             .stateIn(viewModelScope, SharingStarted.Eagerly, emptyList())
 
+    // Clock Font Axis Editor
+    private val overrideFontAxes = MutableStateFlow<Map<String, Float>?>(null)
+    val previewingFontAxes =
+        combine(overrideFontAxes, previewingClock) { overrideAxes, previewingClock ->
+                overrideAxes ?: previewingClock.axes.associate { it.key to it.currentValue }
+            }
+            .stateIn(viewModelScope, SharingStarted.Eagerly, emptyMap())
+
+    fun updatePreviewFontAxis(key: String, value: Float) {
+        val fontAxes = previewingFontAxes.value.toMutableMap()
+        fontAxes[key] = value
+        overrideFontAxes.value = fontAxes
+    }
+
+    fun applyFontAxes() {
+        _selectedTab.value = Tab.STYLE
+    }
+
+    fun revertFontAxes() {
+        overrideFontAxes.value = null
+        _selectedTab.value = Tab.STYLE
+    }
+
     // Clock size
     private val overridingClockSize = MutableStateFlow<ClockSize?>(null)
     val previewingClockSize =
@@ -360,6 +390,7 @@
         overridingClockSize.value = null
         overridingClockColorId.value = null
         overridingSliderProgress.value = null
+        overrideFontAxes.value = null
         _selectedTab.value = Tab.STYLE
     }
 
diff --git a/src/com/android/wallpaper/customization/ui/viewmodel/ShapeGridPickerViewModel.kt b/src/com/android/wallpaper/customization/ui/viewmodel/ShapeGridPickerViewModel.kt
index 7f3c4cb..7be934d 100644
--- a/src/com/android/wallpaper/customization/ui/viewmodel/ShapeGridPickerViewModel.kt
+++ b/src/com/android/wallpaper/customization/ui/viewmodel/ShapeGridPickerViewModel.kt
@@ -20,7 +20,6 @@
 import android.content.res.Resources
 import com.android.customization.model.ResourceConstants
 import com.android.customization.model.grid.GridOptionModel
-import com.android.customization.model.grid.ShapeOptionModel
 import com.android.customization.picker.grid.domain.interactor.ShapeGridInteractor
 import com.android.customization.picker.grid.ui.viewmodel.GridIconViewModel
 import com.android.customization.picker.grid.ui.viewmodel.ShapeIconViewModel
@@ -42,6 +41,7 @@
 import kotlinx.coroutines.flow.asStateFlow
 import kotlinx.coroutines.flow.combine
 import kotlinx.coroutines.flow.filterNotNull
+import kotlinx.coroutines.flow.flowOf
 import kotlinx.coroutines.flow.map
 import kotlinx.coroutines.flow.shareIn
 import kotlinx.coroutines.flow.stateIn
@@ -59,7 +59,36 @@
         GRID,
     }
 
-    //// Tabs
+    // TODO (b/362237825): Get the shape options from the Launcher
+    val shapePaths =
+        listOf(
+            Pair(
+                "arch",
+                "M100 83.46C100 85.471 100 86.476 99.9 87.321 99.116 93.916 93.916 99.116 87.321 99.9 86.476 100 85.471 100 83.46 100H16.54C14.529 100 13.524 100 12.679 99.9 6.084 99.116.884 93.916.1 87.321 0 86.476 0 85.471 0 83.46L0 50C0 22.386 22.386 0 50 0 77.614 0 100 22.386 100 50V83.46Z",
+            ),
+            Pair(
+                "4-sided-cookie",
+                "M63.605 3C84.733-6.176 106.176 15.268 97 36.395L95.483 39.888C92.681 46.338 92.681 53.662 95.483 60.112L97 63.605C106.176 84.732 84.733 106.176 63.605 97L60.112 95.483C53.662 92.681 46.338 92.681 39.888 95.483L36.395 97C15.267 106.176-6.176 84.732 3 63.605L4.517 60.112C7.319 53.662 7.319 46.338 4.517 39.888L3 36.395C-6.176 15.268 15.267-6.176 36.395 3L39.888 4.517C46.338 7.319 53.662 7.319 60.112 4.517L63.605 3Z",
+            ),
+            Pair(
+                "7-sided-cookie",
+                "M35.209 4.878C36.326 3.895 36.884 3.404 37.397 3.006 44.82-2.742 55.18-2.742 62.603 3.006 63.116 3.404 63.674 3.895 64.791 4.878 65.164 5.207 65.351 5.371 65.539 5.529 68.167 7.734 71.303 9.248 74.663 9.932 74.902 9.981 75.147 10.025 75.637 10.113 77.1 10.375 77.831 10.506 78.461 10.66 87.573 12.893 94.032 21.011 94.176 30.412 94.186 31.062 94.151 31.805 94.08 33.293 94.057 33.791 94.045 34.04 94.039 34.285 93.958 37.72 94.732 41.121 96.293 44.18 96.404 44.399 96.522 44.618 96.759 45.056 97.467 46.366 97.821 47.021 98.093 47.611 102.032 56.143 99.727 66.266 92.484 72.24 91.983 72.653 91.381 73.089 90.177 73.961 89.774 74.254 89.572 74.4 89.377 74.548 86.647 76.626 84.477 79.353 83.063 82.483 82.962 82.707 82.865 82.936 82.671 83.395 82.091 84.766 81.8 85.451 81.51 86.033 77.31 94.44 67.977 98.945 58.801 96.994 58.166 96.859 57.451 96.659 56.019 96.259 55.54 96.125 55.3 96.058 55.063 95.998 51.74 95.154 48.26 95.154 44.937 95.998 44.699 96.058 44.46 96.125 43.981 96.259 42.549 96.659 41.834 96.859 41.199 96.994 32.023 98.945 22.69 94.44 18.49 86.033 18.2 85.451 17.909 84.766 17.329 83.395 17.135 82.936 17.038 82.707 16.937 82.483 15.523 79.353 13.353 76.626 10.623 74.548 10.428 74.4 10.226 74.254 9.823 73.961 8.619 73.089 8.017 72.653 7.516 72.24.273 66.266-2.032 56.143 1.907 47.611 2.179 47.021 2.533 46.366 3.241 45.056 3.478 44.618 3.596 44.399 3.707 44.18 5.268 41.121 6.042 37.72 5.961 34.285 5.955 34.04 5.943 33.791 5.92 33.293 5.849 31.805 5.814 31.062 5.824 30.412 5.968 21.011 12.427 12.893 21.539 10.66 22.169 10.506 22.9 10.375 24.363 10.113 24.853 10.025 25.098 9.981 25.337 9.932 28.697 9.248 31.833 7.734 34.461 5.529 34.649 5.371 34.836 5.207 35.209 4.878Z",
+            ),
+            Pair(
+                "sunny",
+                "M42.846 4.873C46.084-.531 53.916-.531 57.154 4.873L60.796 10.951C62.685 14.103 66.414 15.647 69.978 14.754L76.851 13.032C82.962 11.5 88.5 17.038 86.968 23.149L85.246 30.022C84.353 33.586 85.897 37.315 89.049 39.204L95.127 42.846C100.531 46.084 100.531 53.916 95.127 57.154L89.049 60.796C85.897 62.685 84.353 66.414 85.246 69.978L86.968 76.851C88.5 82.962 82.962 88.5 76.851 86.968L69.978 85.246C66.414 84.353 62.685 85.898 60.796 89.049L57.154 95.127C53.916 100.531 46.084 100.531 42.846 95.127L39.204 89.049C37.315 85.898 33.586 84.353 30.022 85.246L23.149 86.968C17.038 88.5 11.5 82.962 13.032 76.851L14.754 69.978C15.647 66.414 14.103 62.685 10.951 60.796L4.873 57.154C-.531 53.916-.531 46.084 4.873 42.846L10.951 39.204C14.103 37.315 15.647 33.586 14.754 30.022L13.032 23.149C11.5 17.038 17.038 11.5 23.149 13.032L30.022 14.754C33.586 15.647 37.315 14.103 39.204 10.951L42.846 4.873Z",
+            ),
+            Pair(
+                "circle",
+                "M99.18 50C99.18 77.162 77.162 99.18 50 99.18 22.838 99.18.82 77.162.82 50 .82 22.839 22.838.82 50 .82 77.162.82 99.18 22.839 99.18 50Z",
+            ),
+            Pair(
+                "square",
+                "M99.18 53.689C99.18 67.434 99.18 74.306 97.022 79.758 93.897 87.649 87.649 93.897 79.758 97.022 74.306 99.18 67.434 99.18 53.689 99.18H46.311C32.566 99.18 25.694 99.18 20.242 97.022 12.351 93.897 6.103 87.649 2.978 79.758.82 74.306.82 67.434.82 53.689L.82 46.311C.82 32.566.82 25.694 2.978 20.242 6.103 12.351 12.351 6.103 20.242 2.978 25.694.82 32.566.82 46.311.82L53.689.82C67.434.82 74.306.82 79.758 2.978 87.649 6.103 93.897 12.351 97.022 20.242 99.18 25.694 99.18 32.566 99.18 46.311V53.689Z",
+            ),
+        )
+
+    // Tabs
     private val _selectedTab = MutableStateFlow(Tab.SHAPE)
     val selectedTab: StateFlow<Tab> = _selectedTab.asStateFlow()
     val tabs: Flow<List<FloatingToolbarTabViewModel>> =
@@ -88,14 +117,8 @@
             )
         }
 
-    //// Shape
-
     // The currently-set system shape option
-    val selectedShapeKey =
-        interactor.selectedShapeOption
-            .filterNotNull()
-            .map { it.key }
-            .shareIn(scope = viewModelScope, started = SharingStarted.Lazily, replay = 1)
+    val selectedShapeKey = flowOf(shapePaths[0].first)
     private val overridingShapeKey = MutableStateFlow<String?>(null)
     // If the overriding key is null, use the currently-set system shape option
     val previewingShapeKey =
@@ -105,24 +128,21 @@
         }
 
     val shapeOptions: Flow<List<OptionItemViewModel<ShapeIconViewModel>>> =
-        interactor.shapeOptions
-            .filterNotNull()
-            .map { shapeOptions -> shapeOptions.map { toShapeOptionItemViewModel(it) } }
+        MutableStateFlow(shapePaths.map { toShapeOptionItemViewModel(it.first, it.second) })
             .shareIn(scope = viewModelScope, started = SharingStarted.Lazily, replay = 1)
 
-    //// Grid
-
     // The currently-set system grid option
     val selectedGridOption =
         interactor.selectedGridOption
             .filterNotNull()
             .map { toGridOptionItemViewModel(it) }
             .shareIn(scope = viewModelScope, started = SharingStarted.Lazily, replay = 1)
-    private val overridingGridKey = MutableStateFlow<String?>(null)
+    private val overridingGridOptionKey = MutableStateFlow<String?>(null)
     // If the overriding key is null, use the currently-set system grid option
-    val previewingGridKey =
-        combine(overridingGridKey, selectedGridOption) { overridingGridOptionKey, selectedGridOption
-            ->
+    val previewingGridOptionKey =
+        combine(overridingGridOptionKey, selectedGridOption) {
+            overridingGridOptionKey,
+            selectedGridOption ->
             overridingGridOptionKey ?: selectedGridOption.key.value
         }
 
@@ -133,33 +153,29 @@
             .shareIn(scope = viewModelScope, started = SharingStarted.Lazily, replay = 1)
 
     val onApply: Flow<(suspend () -> Unit)?> =
-        combine(previewingGridKey, selectedGridOption, previewingShapeKey, selectedShapeKey) {
+        combine(previewingGridOptionKey, selectedGridOption) {
             previewingGridOptionKey,
-            selectedGridOption,
-            previewingShapeKey,
-            selectedShapeKey ->
-            if (
-                previewingGridOptionKey == selectedGridOption.key.value &&
-                    previewingShapeKey == selectedShapeKey
-            ) {
+            selectedGridOption ->
+            if (previewingGridOptionKey == selectedGridOption.key.value) {
                 null
             } else {
-                { interactor.applySelectedOption(previewingShapeKey, previewingGridOptionKey) }
+                { interactor.applySelectedOption(previewingGridOptionKey) }
             }
         }
 
     fun resetPreview() {
         overridingShapeKey.value = null
-        overridingGridKey.value = null
+        overridingGridOptionKey.value = null
         _selectedTab.value = Tab.SHAPE
     }
 
     private fun toShapeOptionItemViewModel(
-        option: ShapeOptionModel
+        key: String,
+        path: String,
     ): OptionItemViewModel<ShapeIconViewModel> {
         val isSelected =
             previewingShapeKey
-                .map { it == option.key }
+                .map { it == key }
                 .stateIn(
                     scope = viewModelScope,
                     started = SharingStarted.Lazily,
@@ -167,14 +183,14 @@
                 )
 
         return OptionItemViewModel(
-            key = MutableStateFlow(option.key),
-            payload = ShapeIconViewModel(option.key, option.path),
-            text = Text.Loaded(option.title),
+            key = MutableStateFlow(key),
+            payload = ShapeIconViewModel(key, path),
+            text = Text.Loaded(key),
             isSelected = isSelected,
             onClicked =
                 isSelected.map {
                     if (!it) {
-                        { overridingShapeKey.value = option.key }
+                        { overridingShapeKey.value = key }
                     } else {
                         null
                     }
@@ -195,7 +211,7 @@
                     )
             )
         val isSelected =
-            previewingGridKey
+            previewingGridOptionKey
                 .map { it == option.key }
                 .stateIn(
                     scope = viewModelScope,
@@ -212,7 +228,7 @@
             onClicked =
                 isSelected.map {
                     if (!it) {
-                        { overridingGridKey.value = option.key }
+                        { overridingGridOptionKey.value = option.key }
                     } else {
                         null
                     }
diff --git a/src/com/android/wallpaper/customization/ui/viewmodel/ThemePickerCustomizationOptionsViewModel.kt b/src/com/android/wallpaper/customization/ui/viewmodel/ThemePickerCustomizationOptionsViewModel.kt
index d54fd59..2e500e2 100644
--- a/src/com/android/wallpaper/customization/ui/viewmodel/ThemePickerCustomizationOptionsViewModel.kt
+++ b/src/com/android/wallpaper/customization/ui/viewmodel/ThemePickerCustomizationOptionsViewModel.kt
@@ -60,13 +60,20 @@
 
     override val selectedOption = defaultCustomizationOptionsViewModel.selectedOption
 
-    override fun deselectOption(): Boolean {
-        keyguardQuickAffordancePickerViewModel2.resetPreview()
-        shapeGridPickerViewModel.resetPreview()
-        clockPickerViewModel.resetPreview()
-        colorPickerViewModel2.resetPreview()
-        darkModeViewModel.resetPreview()
-        return defaultCustomizationOptionsViewModel.deselectOption()
+    override fun handleBackPressed(): Boolean {
+        val isBackPressedHandled = defaultCustomizationOptionsViewModel.handleBackPressed()
+
+        if (isBackPressedHandled) {
+            // If isBackPressedHandled is handled by DefaultCustomizationOptionsViewModel, it means
+            // we navigate back to the main screen from a secondary screen. Reset preview.
+            keyguardQuickAffordancePickerViewModel2.resetPreview()
+            shapeGridPickerViewModel.resetPreview()
+            clockPickerViewModel.resetPreview()
+            colorPickerViewModel2.resetPreview()
+            darkModeViewModel.resetPreview()
+        }
+
+        return isBackPressedHandled
     }
 
     val onCustomizeClockClicked: Flow<(() -> Unit)?> =
@@ -147,16 +154,12 @@
                 }
             }
             .map { onApply ->
-                {
-                    if (onApply != null) {
-                        viewModelScope.launch {
-                            onApply()
-                            // We only wait until onApply() is done to execute deselectOption()
-                            deselectOption()
-                        }
-                    } else {
-                        null
+                if (onApply != null) {
+                    fun() {
+                        viewModelScope.launch { onApply() }
                     }
+                } else {
+                    null
                 }
             }
             .stateIn(viewModelScope, SharingStarted.Eagerly, null)
diff --git a/src/com/android/wallpaper/picker/common/preview/ui/binder/ThemePickerWorkspaceCallbackBinder.kt b/src/com/android/wallpaper/picker/common/preview/ui/binder/ThemePickerWorkspaceCallbackBinder.kt
index dea3351..0dc38e8 100644
--- a/src/com/android/wallpaper/picker/common/preview/ui/binder/ThemePickerWorkspaceCallbackBinder.kt
+++ b/src/com/android/wallpaper/picker/common/preview/ui/binder/ThemePickerWorkspaceCallbackBinder.kt
@@ -24,8 +24,6 @@
 import androidx.lifecycle.LifecycleOwner
 import androidx.lifecycle.lifecycleScope
 import androidx.lifecycle.repeatOnLifecycle
-import com.android.customization.model.grid.DefaultShapeGridManager.Companion.COL_GRID_KEY
-import com.android.customization.model.grid.DefaultShapeGridManager.Companion.COL_SHAPE_KEY
 import com.android.customization.picker.color.data.util.MaterialColorsGenerator
 import com.android.systemui.shared.keyguard.shared.model.KeyguardQuickAffordanceSlots.SLOT_ID_BOTTOM_END
 import com.android.systemui.shared.keyguard.shared.model.KeyguardQuickAffordanceSlots.SLOT_ID_BOTTOM_START
@@ -139,19 +137,10 @@
                 lifecycleOwner.lifecycleScope.launch {
                     lifecycleOwner.repeatOnLifecycle(Lifecycle.State.STARTED) {
                         launch {
-                            viewModel.shapeGridPickerViewModel.previewingShapeKey.collect {
-                                workspaceCallback.sendMessage(
-                                    MESSAGE_ID_UPDATE_SHAPE,
-                                    bundleOf(COL_SHAPE_KEY to it),
-                                )
-                            }
-                        }
-
-                        launch {
-                            viewModel.shapeGridPickerViewModel.previewingGridKey.collect {
+                            viewModel.shapeGridPickerViewModel.previewingGridOptionKey.collect {
                                 workspaceCallback.sendMessage(
                                     MESSAGE_ID_UPDATE_GRID,
-                                    bundleOf(COL_GRID_KEY to it),
+                                    bundleOf(KEY_GRID_NAME to it),
                                 )
                             }
                         }
@@ -183,8 +172,8 @@
     }
 
     companion object {
-        const val MESSAGE_ID_UPDATE_SHAPE = 2586
         const val MESSAGE_ID_UPDATE_GRID = 7414
+        const val KEY_GRID_NAME = "grid_name"
 
         const val MESSAGE_ID_UPDATE_COLOR = 856
         const val KEY_COLOR_RESOURCE_IDS: String = "color_resource_ids"
diff --git a/tests/common/src/com/android/customization/model/grid/FakeShapeGridManager.kt b/tests/common/src/com/android/customization/model/grid/FakeShapeGridManager.kt
index b1f044a..a5a94c3 100644
--- a/tests/common/src/com/android/customization/model/grid/FakeShapeGridManager.kt
+++ b/tests/common/src/com/android/customization/model/grid/FakeShapeGridManager.kt
@@ -22,17 +22,16 @@
 @Singleton
 class FakeShapeGridManager @Inject constructor() : ShapeGridManager {
 
+    var isGridOptionAvailable: Boolean = true
+
     private var gridOptions: List<GridOptionModel>? = DEFAULT_GRID_OPTION_LIST
 
-    private var shapeOptions: List<ShapeOptionModel>? = DEFAULT_SHAPE_OPTION_LIST
+    override suspend fun isGridOptionAvailable(): Boolean = isGridOptionAvailable
 
     override suspend fun getGridOptions(): List<GridOptionModel>? = gridOptions
 
-    override suspend fun getShapeOptions(): List<ShapeOptionModel>? = shapeOptions
-
-    override fun applyShapeGridOption(shapeKey: String, gridKey: String): Int {
-        shapeOptions = shapeOptions?.map { it.copy(isCurrent = it.key == shapeKey) }
-        gridOptions = gridOptions?.map { it.copy(isCurrent = it.key == gridKey) }
+    override fun applyGridOption(gridName: String): Int {
+        gridOptions = gridOptions?.map { it.copy(isCurrent = it.key == gridName) }
         return 0
     }
 
@@ -54,51 +53,5 @@
                     cols = 4,
                 ),
             )
-
-        val DEFAULT_SHAPE_OPTION_LIST =
-            listOf(
-                ShapeOptionModel(
-                    key = "arch",
-                    title = "arch",
-                    path =
-                        "M100 83.46C100 85.471 100 86.476 99.9 87.321 99.116 93.916 93.916 99.116 87.321 99.9 86.476 100 85.471 100 83.46 100H16.54C14.529 100 13.524 100 12.679 99.9 6.084 99.116.884 93.916.1 87.321 0 86.476 0 85.471 0 83.46L0 50C0 22.386 22.386 0 50 0 77.614 0 100 22.386 100 50V83.46Z",
-                    isCurrent = true,
-                ),
-                ShapeOptionModel(
-                    key = "4-sided-cookie",
-                    title = "4-sided-cookie",
-                    path =
-                        "M63.605 3C84.733-6.176 106.176 15.268 97 36.395L95.483 39.888C92.681 46.338 92.681 53.662 95.483 60.112L97 63.605C106.176 84.732 84.733 106.176 63.605 97L60.112 95.483C53.662 92.681 46.338 92.681 39.888 95.483L36.395 97C15.267 106.176-6.176 84.732 3 63.605L4.517 60.112C7.319 53.662 7.319 46.338 4.517 39.888L3 36.395C-6.176 15.268 15.267-6.176 36.395 3L39.888 4.517C46.338 7.319 53.662 7.319 60.112 4.517L63.605 3Z",
-                    isCurrent = false,
-                ),
-                ShapeOptionModel(
-                    key = "7-sided-cookie",
-                    title = "7-sided-cookie",
-                    path =
-                        "M35.209 4.878C36.326 3.895 36.884 3.404 37.397 3.006 44.82-2.742 55.18-2.742 62.603 3.006 63.116 3.404 63.674 3.895 64.791 4.878 65.164 5.207 65.351 5.371 65.539 5.529 68.167 7.734 71.303 9.248 74.663 9.932 74.902 9.981 75.147 10.025 75.637 10.113 77.1 10.375 77.831 10.506 78.461 10.66 87.573 12.893 94.032 21.011 94.176 30.412 94.186 31.062 94.151 31.805 94.08 33.293 94.057 33.791 94.045 34.04 94.039 34.285 93.958 37.72 94.732 41.121 96.293 44.18 96.404 44.399 96.522 44.618 96.759 45.056 97.467 46.366 97.821 47.021 98.093 47.611 102.032 56.143 99.727 66.266 92.484 72.24 91.983 72.653 91.381 73.089 90.177 73.961 89.774 74.254 89.572 74.4 89.377 74.548 86.647 76.626 84.477 79.353 83.063 82.483 82.962 82.707 82.865 82.936 82.671 83.395 82.091 84.766 81.8 85.451 81.51 86.033 77.31 94.44 67.977 98.945 58.801 96.994 58.166 96.859 57.451 96.659 56.019 96.259 55.54 96.125 55.3 96.058 55.063 95.998 51.74 95.154 48.26 95.154 44.937 95.998 44.699 96.058 44.46 96.125 43.981 96.259 42.549 96.659 41.834 96.859 41.199 96.994 32.023 98.945 22.69 94.44 18.49 86.033 18.2 85.451 17.909 84.766 17.329 83.395 17.135 82.936 17.038 82.707 16.937 82.483 15.523 79.353 13.353 76.626 10.623 74.548 10.428 74.4 10.226 74.254 9.823 73.961 8.619 73.089 8.017 72.653 7.516 72.24.273 66.266-2.032 56.143 1.907 47.611 2.179 47.021 2.533 46.366 3.241 45.056 3.478 44.618 3.596 44.399 3.707 44.18 5.268 41.121 6.042 37.72 5.961 34.285 5.955 34.04 5.943 33.791 5.92 33.293 5.849 31.805 5.814 31.062 5.824 30.412 5.968 21.011 12.427 12.893 21.539 10.66 22.169 10.506 22.9 10.375 24.363 10.113 24.853 10.025 25.098 9.981 25.337 9.932 28.697 9.248 31.833 7.734 34.461 5.529 34.649 5.371 34.836 5.207 35.209 4.878Z",
-                    isCurrent = false,
-                ),
-                ShapeOptionModel(
-                    key = "sunny",
-                    title = "sunny",
-                    path =
-                        "M42.846 4.873C46.084-.531 53.916-.531 57.154 4.873L60.796 10.951C62.685 14.103 66.414 15.647 69.978 14.754L76.851 13.032C82.962 11.5 88.5 17.038 86.968 23.149L85.246 30.022C84.353 33.586 85.897 37.315 89.049 39.204L95.127 42.846C100.531 46.084 100.531 53.916 95.127 57.154L89.049 60.796C85.897 62.685 84.353 66.414 85.246 69.978L86.968 76.851C88.5 82.962 82.962 88.5 76.851 86.968L69.978 85.246C66.414 84.353 62.685 85.898 60.796 89.049L57.154 95.127C53.916 100.531 46.084 100.531 42.846 95.127L39.204 89.049C37.315 85.898 33.586 84.353 30.022 85.246L23.149 86.968C17.038 88.5 11.5 82.962 13.032 76.851L14.754 69.978C15.647 66.414 14.103 62.685 10.951 60.796L4.873 57.154C-.531 53.916-.531 46.084 4.873 42.846L10.951 39.204C14.103 37.315 15.647 33.586 14.754 30.022L13.032 23.149C11.5 17.038 17.038 11.5 23.149 13.032L30.022 14.754C33.586 15.647 37.315 14.103 39.204 10.951L42.846 4.873Z",
-                    isCurrent = false,
-                ),
-                ShapeOptionModel(
-                    key = "circle",
-                    title = "circle",
-                    path =
-                        "M99.18 50C99.18 77.162 77.162 99.18 50 99.18 22.838 99.18.82 77.162.82 50 .82 22.839 22.838.82 50 .82 77.162.82 99.18 22.839 99.18 50Z",
-                    isCurrent = false,
-                ),
-                ShapeOptionModel(
-                    key = "square",
-                    title = "square",
-                    path =
-                        "M99.18 53.689C99.18 67.434 99.18 74.306 97.022 79.758 93.897 87.649 87.649 93.897 79.758 97.022 74.306 99.18 67.434 99.18 53.689 99.18H46.311C32.566 99.18 25.694 99.18 20.242 97.022 12.351 93.897 6.103 87.649 2.978 79.758.82 74.306.82 67.434.82 53.689L.82 46.311C.82 32.566.82 25.694 2.978 20.242 6.103 12.351 12.351 6.103 20.242 2.978 25.694.82 32.566.82 46.311.82L53.689.82C67.434.82 74.306.82 79.758 2.978 87.649 6.103 93.897 12.351 97.022 20.242 99.18 25.694 99.18 32.566 99.18 46.311V53.689Z",
-                    isCurrent = false,
-                ),
-            )
     }
 }
diff --git a/tests/robotests/src/com/android/customization/picker/clock/data/repository/FakeClockPickerRepository.kt b/tests/robotests/src/com/android/customization/picker/clock/data/repository/FakeClockPickerRepository.kt
index 729241f..c1a4a65 100644
--- a/tests/robotests/src/com/android/customization/picker/clock/data/repository/FakeClockPickerRepository.kt
+++ b/tests/robotests/src/com/android/customization/picker/clock/data/repository/FakeClockPickerRepository.kt
@@ -22,6 +22,8 @@
 import com.android.customization.picker.clock.data.repository.FakeClockPickerRepository.Companion.fakeClocks
 import com.android.customization.picker.clock.shared.ClockSize
 import com.android.customization.picker.clock.shared.model.ClockMetadataModel
+import com.android.systemui.plugins.clocks.AxisType
+import com.android.systemui.plugins.clocks.ClockFontAxis
 import kotlinx.coroutines.flow.Flow
 import kotlinx.coroutines.flow.MutableStateFlow
 import kotlinx.coroutines.flow.asStateFlow
@@ -50,7 +52,7 @@
                 description = "description",
                 thumbnail = ColorDrawable(0),
                 isReactiveToTone = selectedClock.isReactiveToTone,
-                hasReactiveAxes = false,
+                axes = fakeAxisList,
                 selectedColorId = selectedColor,
                 colorToneProgress = colorTone,
                 seedColor = seedColor,
@@ -79,6 +81,19 @@
     }
 
     companion object {
+        private val fakeAxisList =
+            listOf(
+                ClockFontAxis(
+                    key = "key",
+                    type = AxisType.Float,
+                    maxValue = 0f,
+                    minValue = 100f,
+                    currentValue = 50f,
+                    name = "FakeAxis",
+                    description = "Axis Description",
+                )
+            )
+
         const val CLOCK_ID_0 = "clock0"
         const val CLOCK_ID_1 = "clock1"
         const val CLOCK_ID_2 = "clock2"
@@ -91,7 +106,7 @@
                     "description0",
                     ColorDrawable(0),
                     true,
-                    false,
+                    fakeAxisList,
                     null,
                     50,
                     null,
@@ -102,7 +117,7 @@
                     "description1",
                     ColorDrawable(0),
                     true,
-                    false,
+                    fakeAxisList,
                     null,
                     50,
                     null,
@@ -113,7 +128,7 @@
                     "description2",
                     ColorDrawable(0),
                     true,
-                    false,
+                    fakeAxisList,
                     null,
                     50,
                     null,
@@ -124,7 +139,7 @@
                     "description3",
                     ColorDrawable(0),
                     false,
-                    false,
+                    fakeAxisList,
                     null,
                     50,
                     null,
diff --git a/tests/robotests/src/com/android/customization/picker/clock/ui/FakeClockViewFactory.kt b/tests/robotests/src/com/android/customization/picker/clock/ui/FakeClockViewFactory.kt
index d2acb16..bb2ad4c 100644
--- a/tests/robotests/src/com/android/customization/picker/clock/ui/FakeClockViewFactory.kt
+++ b/tests/robotests/src/com/android/customization/picker/clock/ui/FakeClockViewFactory.kt
@@ -8,6 +8,7 @@
 import com.android.systemui.plugins.clocks.ClockController
 import com.android.systemui.plugins.clocks.ClockEvents
 import com.android.systemui.plugins.clocks.ClockFaceController
+import com.android.systemui.plugins.clocks.ClockFontAxisSetting
 import java.io.PrintWriter
 import javax.inject.Inject
 
@@ -56,6 +57,10 @@
         TODO("Not yet implemented")
     }
 
+    override fun updateFontAxes(clockId: String, settings: List<ClockFontAxisSetting>) {
+        TODO("Not yet implemented")
+    }
+
     override fun updateRegionDarkness() {
         TODO("Not yet implemented")
     }
diff --git a/tests/robotests/src/com/android/customization/picker/clock/ui/viewmodel/ClockCarouselViewModelTest.kt b/tests/robotests/src/com/android/customization/picker/clock/ui/viewmodel/ClockCarouselViewModelTest.kt
index cf1cc55..166855f 100644
--- a/tests/robotests/src/com/android/customization/picker/clock/ui/viewmodel/ClockCarouselViewModelTest.kt
+++ b/tests/robotests/src/com/android/customization/picker/clock/ui/viewmodel/ClockCarouselViewModelTest.kt
@@ -58,7 +58,7 @@
                     description = "description",
                     thumbnail = ColorDrawable(0),
                     isReactiveToTone = true,
-                    hasReactiveAxes = false,
+                    axes = listOf(),
                     selectedColorId = null,
                     colorToneProgress = ClockMetadataModel.DEFAULT_COLOR_TONE_PROGRESS,
                     seedColor = null,
diff --git a/tests/robotests/src/com/android/customization/picker/grid/data/repository/ShapeGridRepositoryTest.kt b/tests/robotests/src/com/android/customization/picker/grid/data/repository/ShapeGridRepositoryTest.kt
index 985d983..61f8743 100644
--- a/tests/robotests/src/com/android/customization/picker/grid/data/repository/ShapeGridRepositoryTest.kt
+++ b/tests/robotests/src/com/android/customization/picker/grid/data/repository/ShapeGridRepositoryTest.kt
@@ -69,87 +69,52 @@
     }
 
     @Test
-    fun shapeOptions_default() =
+    fun isGridOptionAvailable_false() =
         testScope.runTest {
-            val gridOptions = collectLastValue(underTest.shapeOptions)
-
-            assertThat(gridOptions()).isEqualTo(FakeShapeGridManager.DEFAULT_SHAPE_OPTION_LIST)
+            gridOptionsManager.isGridOptionAvailable = false
+            assertThat(underTest.isGridOptionAvailable()).isFalse()
         }
 
     @Test
-    fun shapeOptions_shouldUpdateAfterApplyShapeGridOption() =
+    fun isGridOptionAvailable_true() =
         testScope.runTest {
-            val shapeOptions = collectLastValue(underTest.shapeOptions)
-
-            underTest.applySelectedOption("circle", "practical")
-
-            assertThat(shapeOptions())
-                .isEqualTo(
-                    FakeShapeGridManager.DEFAULT_SHAPE_OPTION_LIST.map {
-                        it.copy(isCurrent = (it.key == "circle"))
-                    }
-                )
-        }
-
-    @Test
-    fun selectedShapeOption_default() =
-        testScope.runTest {
-            val selectedGridOption = collectLastValue(underTest.selectedShapeOption)
-
-            assertThat(selectedGridOption())
-                .isEqualTo(FakeShapeGridManager.DEFAULT_SHAPE_OPTION_LIST[0])
-        }
-
-    @Test
-    fun selectedShapeOption_shouldUpdateAfterApplyShapeGridOption() =
-        testScope.runTest {
-            val selectedShapeOption = collectLastValue(underTest.selectedShapeOption)
-
-            underTest.applySelectedOption("circle", "practical")
-
-            assertThat(selectedShapeOption())
-                .isEqualTo(FakeShapeGridManager.DEFAULT_SHAPE_OPTION_LIST[4].copy(isCurrent = true))
+            gridOptionsManager.isGridOptionAvailable = true
+            assertThat(underTest.isGridOptionAvailable()).isTrue()
         }
 
     @Test
     fun gridOptions_default() =
         testScope.runTest {
             val gridOptions = collectLastValue(underTest.gridOptions)
-
             assertThat(gridOptions()).isEqualTo(FakeShapeGridManager.DEFAULT_GRID_OPTION_LIST)
         }
 
     @Test
-    fun gridOptions_shouldUpdateAfterApplyShapeGridOption() =
-        testScope.runTest {
-            val gridOptions = collectLastValue(underTest.gridOptions)
-
-            underTest.applySelectedOption("circle", "practical")
-
-            assertThat(gridOptions())
-                .isEqualTo(
-                    FakeShapeGridManager.DEFAULT_GRID_OPTION_LIST.map {
-                        it.copy(isCurrent = (it.key == "practical"))
-                    }
-                )
-        }
-
-    @Test
     fun selectedGridOption_default() =
         testScope.runTest {
             val selectedGridOption = collectLastValue(underTest.selectedGridOption)
-
             assertThat(selectedGridOption())
                 .isEqualTo(FakeShapeGridManager.DEFAULT_GRID_OPTION_LIST[0])
         }
 
     @Test
-    fun selectedGridOption_shouldUpdateAfterApplyShapeGridOption() =
+    fun gridOptions_shouldUpdateAfterApplyGridOption() =
+        testScope.runTest {
+            val gridOptions = collectLastValue(underTest.gridOptions)
+            underTest.applySelectedOption("practical")
+            assertThat(gridOptions())
+                .isEqualTo(
+                    FakeShapeGridManager.DEFAULT_GRID_OPTION_LIST.map {
+                        it.copy(isCurrent = it.key == "practical")
+                    }
+                )
+        }
+
+    @Test
+    fun selectedGridOption_shouldUpdateAfterApplyGridOption() =
         testScope.runTest {
             val selectedGridOption = collectLastValue(underTest.selectedGridOption)
-
-            underTest.applySelectedOption("circle", "practical")
-
+            underTest.applySelectedOption("practical")
             assertThat(selectedGridOption())
                 .isEqualTo(FakeShapeGridManager.DEFAULT_GRID_OPTION_LIST[1].copy(isCurrent = true))
         }
diff --git a/tests/robotests/src/com/android/customization/picker/grid/domain/interactor/ShapeGridInteractorTest.kt b/tests/robotests/src/com/android/customization/picker/grid/domain/interactor/ShapeGridInteractorTest.kt
index c0f519c..51642cb 100644
--- a/tests/robotests/src/com/android/customization/picker/grid/domain/interactor/ShapeGridInteractorTest.kt
+++ b/tests/robotests/src/com/android/customization/picker/grid/domain/interactor/ShapeGridInteractorTest.kt
@@ -61,87 +61,52 @@
     }
 
     @Test
-    fun shapeOptions_default() =
+    fun isGridOptionAvailable_false() =
         testScope.runTest {
-            val shapeOptions = collectLastValue(underTest.shapeOptions)
-
-            assertThat(shapeOptions()).isEqualTo(FakeShapeGridManager.DEFAULT_SHAPE_OPTION_LIST)
+            gridOptionsManager.isGridOptionAvailable = false
+            assertThat(underTest.isGridOptionAvailable()).isFalse()
         }
 
     @Test
-    fun shapeOptions_shouldUpdateAfterApplyGridOption() =
+    fun isGridOptionAvailable_true() =
         testScope.runTest {
-            val shapeOptions = collectLastValue(underTest.shapeOptions)
-
-            underTest.applySelectedOption("circle", "practical")
-
-            assertThat(shapeOptions())
-                .isEqualTo(
-                    FakeShapeGridManager.DEFAULT_SHAPE_OPTION_LIST.map {
-                        it.copy(isCurrent = (it.key == "circle"))
-                    }
-                )
-        }
-
-    @Test
-    fun selectedShapeOption_default() =
-        testScope.runTest {
-            val selectedShapeOption = collectLastValue(underTest.selectedShapeOption)
-
-            assertThat(selectedShapeOption())
-                .isEqualTo(FakeShapeGridManager.DEFAULT_SHAPE_OPTION_LIST[0])
-        }
-
-    @Test
-    fun selectedShapeOption_shouldUpdateAfterApplyGridOption() =
-        testScope.runTest {
-            val selectedShapeOption = collectLastValue(underTest.selectedShapeOption)
-
-            underTest.applySelectedOption("circle", "practical")
-
-            assertThat(selectedShapeOption())
-                .isEqualTo(FakeShapeGridManager.DEFAULT_SHAPE_OPTION_LIST[4].copy(isCurrent = true))
+            gridOptionsManager.isGridOptionAvailable = true
+            assertThat(underTest.isGridOptionAvailable()).isTrue()
         }
 
     @Test
     fun gridOptions_default() =
         testScope.runTest {
             val gridOptions = collectLastValue(underTest.gridOptions)
-
             assertThat(gridOptions()).isEqualTo(FakeShapeGridManager.DEFAULT_GRID_OPTION_LIST)
         }
 
     @Test
-    fun gridOptions_shouldUpdateAfterApplyGridOption() =
-        testScope.runTest {
-            val gridOptions = collectLastValue(underTest.gridOptions)
-
-            underTest.applySelectedOption("arch", "practical")
-
-            assertThat(gridOptions())
-                .isEqualTo(
-                    FakeShapeGridManager.DEFAULT_GRID_OPTION_LIST.map {
-                        it.copy(isCurrent = (it.key == "practical"))
-                    }
-                )
-        }
-
-    @Test
     fun selectedGridOption_default() =
         testScope.runTest {
             val selectedGridOption = collectLastValue(underTest.selectedGridOption)
-
             assertThat(selectedGridOption())
                 .isEqualTo(FakeShapeGridManager.DEFAULT_GRID_OPTION_LIST[0])
         }
 
     @Test
+    fun gridOptions_shouldUpdateAfterApplyGridOption() =
+        testScope.runTest {
+            val gridOptions = collectLastValue(underTest.gridOptions)
+            underTest.applySelectedOption("practical")
+            assertThat(gridOptions())
+                .isEqualTo(
+                    FakeShapeGridManager.DEFAULT_GRID_OPTION_LIST.map {
+                        it.copy(isCurrent = it.key == "practical")
+                    }
+                )
+        }
+
+    @Test
     fun selectedGridOption_shouldUpdateAfterApplyGridOption() =
         testScope.runTest {
             val selectedGridOption = collectLastValue(underTest.selectedGridOption)
-
-            underTest.applySelectedOption("arch", "practical")
-
+            underTest.applySelectedOption("practical")
             assertThat(selectedGridOption())
                 .isEqualTo(FakeShapeGridManager.DEFAULT_GRID_OPTION_LIST[1].copy(isCurrent = true))
         }
diff --git a/tests/robotests/src/com/android/wallpaper/customization/ui/viewmodel/ClockPickerViewModelTest.kt b/tests/robotests/src/com/android/wallpaper/customization/ui/viewmodel/ClockPickerViewModelTest.kt
index 6bec3df..8b87368 100644
--- a/tests/robotests/src/com/android/wallpaper/customization/ui/viewmodel/ClockPickerViewModelTest.kt
+++ b/tests/robotests/src/com/android/wallpaper/customization/ui/viewmodel/ClockPickerViewModelTest.kt
@@ -138,6 +138,22 @@
     }
 
     @Test
+    fun selectedTab_fontEditorWhenClickSelectedClock() = runTest {
+        val clockStyleOptions = collectLastValue(underTest.clockStyleOptions)
+        val selectedTab = collectLastValue(underTest.selectedTab)
+        // Advance CLOCKS_EVENT_UPDATE_DELAY_MILLIS since there is a delay from clockStyleOptions
+        advanceTimeBy(ClockPickerViewModel.CLOCKS_EVENT_UPDATE_DELAY_MILLIS)
+        assertThat(selectedTab()).isEqualTo(Tab.STYLE)
+
+        val firstClock = clockStyleOptions()!![0]
+        val onClicked = collectLastValue(firstClock.onClicked)
+        if (!firstClock.isSelected.value) onClicked()?.invoke()
+        onClicked()?.invoke()
+
+        assertThat(selectedTab()).isEqualTo(Tab.FONT)
+    }
+
+    @Test
     fun previewingClock_whenClickOnStyleOptions() = runTest {
         val previewingClock = collectLastValue(underTest.previewingClock)
         val clockStyleOptions = collectLastValue(underTest.clockStyleOptions)
@@ -165,7 +181,7 @@
         val option1OnClicked = collectLastValue(clockStyleOptions()!![1].onClicked)
 
         assertThat(option0IsSelected()).isTrue()
-        assertThat(option0OnClicked()).isNull()
+        assertThat(option0OnClicked()).isNotNull()
 
         option1OnClicked()?.invoke()
         // Advance CLOCKS_EVENT_UPDATE_DELAY_MILLIS since there is a delay from clockColorOptions
@@ -173,7 +189,7 @@
 
         assertThat(option0IsSelected()).isFalse()
         assertThat(option1IsSelected()).isTrue()
-        assertThat(option1OnClicked()).isNull()
+        assertThat(option1OnClicked()).isNotNull()
     }
 
     @Test
@@ -190,6 +206,76 @@
     }
 
     @Test
+    fun previewingFontAxes_defaultWhenNoOverrides() = runTest {
+        val previewingFontAxes = collectLastValue(underTest.previewingFontAxes)
+        assertThat(previewingFontAxes()).isEqualTo(mapOf("key" to 50f))
+    }
+
+    @Test
+    fun previewingFontAxes_updateAxisChangesSetting() = runTest {
+        val previewingFontAxes = collectLastValue(underTest.previewingFontAxes)
+        assertThat(previewingFontAxes()).isEqualTo(mapOf("key" to 50f))
+
+        underTest.updatePreviewFontAxis("key", 100f)
+        assertThat(previewingFontAxes()).isEqualTo(mapOf("key" to 100f))
+
+        underTest.updatePreviewFontAxis("extra", 10f)
+        assertThat(previewingFontAxes()).isEqualTo(mapOf("key" to 100f, "extra" to 10f))
+    }
+
+    @Test
+    fun previewingFontAxes_applyFontEditorExitsTab_keepsPreviewAxis() = runTest {
+        val previewingFontAxes = collectLastValue(underTest.previewingFontAxes)
+        val clockStyleOptions = collectLastValue(underTest.clockStyleOptions)
+        val selectedTab = collectLastValue(underTest.selectedTab)
+        // Advance CLOCKS_EVENT_UPDATE_DELAY_MILLIS since there is a delay from clockStyleOptions
+        advanceTimeBy(ClockPickerViewModel.CLOCKS_EVENT_UPDATE_DELAY_MILLIS)
+
+        assertThat(previewingFontAxes()).isEqualTo(mapOf("key" to 50f))
+        assertThat(selectedTab()).isEqualTo(Tab.STYLE)
+
+        val firstClock = clockStyleOptions()!![0]
+        val onClicked = collectLastValue(firstClock.onClicked)
+        if (!firstClock.isSelected.value) onClicked()?.invoke()
+        onClicked()?.invoke()
+        underTest.updatePreviewFontAxis("key", 100f)
+
+        assertThat(selectedTab()).isEqualTo(Tab.FONT)
+        assertThat(previewingFontAxes()).isEqualTo(mapOf("key" to 100f))
+
+        underTest.applyFontAxes()
+
+        assertThat(selectedTab()).isEqualTo(Tab.STYLE)
+        assertThat(previewingFontAxes()).isEqualTo(mapOf("key" to 100f))
+    }
+
+    @Test
+    fun previewingFontAxes_revertFontEditorExitsTab_revertsPreviewAxis() = runTest {
+        val previewingFontAxes = collectLastValue(underTest.previewingFontAxes)
+        val clockStyleOptions = collectLastValue(underTest.clockStyleOptions)
+        val selectedTab = collectLastValue(underTest.selectedTab)
+        // Advance CLOCKS_EVENT_UPDATE_DELAY_MILLIS since there is a delay from clockStyleOptions
+        advanceTimeBy(ClockPickerViewModel.CLOCKS_EVENT_UPDATE_DELAY_MILLIS)
+
+        assertThat(previewingFontAxes()).isEqualTo(mapOf("key" to 50f))
+        assertThat(selectedTab()).isEqualTo(Tab.STYLE)
+
+        val firstClock = clockStyleOptions()!![0]
+        val onClicked = collectLastValue(firstClock.onClicked)
+        if (!firstClock.isSelected.value) onClicked()?.invoke()
+        onClicked()?.invoke()
+        underTest.updatePreviewFontAxis("key", 100f)
+
+        assertThat(selectedTab()).isEqualTo(Tab.FONT)
+        assertThat(previewingFontAxes()).isEqualTo(mapOf("key" to 100f))
+
+        underTest.revertFontAxes()
+
+        assertThat(selectedTab()).isEqualTo(Tab.STYLE)
+        assertThat(previewingFontAxes()).isEqualTo(mapOf("key" to 50f))
+    }
+
+    @Test
     fun sliderProgress_whenOnSliderProgressChanged() = runTest {
         val sliderProgress = collectLastValue(underTest.previewingSliderProgress)
 
diff --git a/tests/robotests/src/com/android/wallpaper/customization/ui/viewmodel/ShapeGridPickerViewModelTest.kt b/tests/robotests/src/com/android/wallpaper/customization/ui/viewmodel/ShapeGridPickerViewModelTest.kt
index c99acca..dcf658e 100644
--- a/tests/robotests/src/com/android/wallpaper/customization/ui/viewmodel/ShapeGridPickerViewModelTest.kt
+++ b/tests/robotests/src/com/android/wallpaper/customization/ui/viewmodel/ShapeGridPickerViewModelTest.kt
@@ -109,16 +109,14 @@
         testScope.runTest {
             val shapeOptions = collectLastValue(underTest.shapeOptions)
 
-            for (i in 0 until FakeShapeGridManager.DEFAULT_SHAPE_OPTION_LIST.size) {
-                val (expectedKey, expectedPath, expectedTitle) =
-                    with(FakeShapeGridManager.DEFAULT_SHAPE_OPTION_LIST[i]) {
-                        arrayOf(key, path, title)
-                    }
+            for (i in 0 until underTest.shapePaths.size) {
+                val expectedKey = underTest.shapePaths[i].first
+                val expectedPath = underTest.shapePaths[i].second
                 assertShapeItem(
                     optionItem = shapeOptions()?.get(i),
-                    key = FakeShapeGridManager.DEFAULT_SHAPE_OPTION_LIST[i].key,
+                    key = expectedKey,
                     payload = ShapeIconViewModel(expectedKey, expectedPath),
-                    text = Text.Loaded(expectedTitle),
+                    text = Text.Loaded(expectedKey),
                     isTextUserVisible = true,
                     isSelected = expectedKey == "arch",
                     isEnabled = true,
@@ -138,15 +136,14 @@
             onCircleOptionClicked()?.invoke()
 
             assertThat(previewingShapeKey()).isEqualTo("circle")
-            for (i in 0 until FakeShapeGridManager.DEFAULT_SHAPE_OPTION_LIST.size) {
-                val expectedKey = FakeShapeGridManager.DEFAULT_SHAPE_OPTION_LIST[i].key
-                val expectedPath = FakeShapeGridManager.DEFAULT_SHAPE_OPTION_LIST[i].path
-                val expectedTitle = FakeShapeGridManager.DEFAULT_SHAPE_OPTION_LIST[i].title
+            for (i in 0 until underTest.shapePaths.size) {
+                val expectedKey = underTest.shapePaths[i].first
+                val expectedPath = underTest.shapePaths[i].second
                 assertShapeItem(
                     optionItem = shapeOptions()?.get(i),
                     key = expectedKey,
                     payload = ShapeIconViewModel(expectedKey, expectedPath),
-                    text = Text.Loaded(expectedTitle),
+                    text = Text.Loaded(expectedKey),
                     isTextUserVisible = true,
                     isSelected = expectedKey == "circle",
                     isEnabled = true,
diff --git a/themes/res/values-mk/strings.xml b/themes/res/values-mk/strings.xml
index 94d1098..5426e3b 100644
--- a/themes/res/values-mk/strings.xml
+++ b/themes/res/values-mk/strings.xml
@@ -24,5 +24,5 @@
     <string name="rainbow_color_name_blue" msgid="3473176664458856892">"Сина"</string>
     <string name="rainbow_color_name_purple" msgid="2704722524588084868">"Виолетова"</string>
     <string name="rainbow_color_name_magenta" msgid="7248703626077785569">"Магента"</string>
-    <string name="monochromatic_name" msgid="2554823570460886176">"Монохроматски"</string>
+    <string name="monochromatic_name" msgid="2554823570460886176">"Еднобојно"</string>
 </resources>