diff --git a/lib/widgets/theme.dart b/lib/widgets/theme.dart
index d6ee380376..c1be256ca4 100644
--- a/lib/widgets/theme.dart
+++ b/lib/widgets/theme.dart
@@ -5,16 +5,17 @@ import 'text.dart';
 ThemeData zulipThemeData(BuildContext context) {
   return ThemeData(
     typography: zulipTypography(context),
-    appBarTheme: const AppBarTheme(
+    appBarTheme: AppBarTheme(
       // Set these two fields to prevent a color change in [AppBar]s when
       // there is something scrolled under it. If an app bar hasn't been
       // given a backgroundColor directly or by theme, it uses
       // ColorScheme.surfaceContainer for the scrolled-under state and
       // ColorScheme.surface otherwise, and those are different colors.
       scrolledUnderElevation: 0,
-      backgroundColor: Color(0xfff5f5f5),
+      backgroundColor: const HSLColor.fromAHSL(1, 0, 0, 0.97).toColor(),
 
-      shape: Border(bottom: BorderSide(color: Color(0xffcccccc))),
+      shape: Border(
+        bottom: BorderSide(color: const HSLColor.fromAHSL(1, 0, 0, 0.8).toColor())),
     ),
     // This applies Material 3's color system to produce a palette of
     // appropriately matching and contrasting colors for use in a UI.
@@ -27,7 +28,7 @@ ThemeData zulipThemeData(BuildContext context) {
     colorScheme: ColorScheme.fromSeed(
       seedColor: kZulipBrandColor,
     ),
-    scaffoldBackgroundColor: const Color(0xfff6f6f6),
+    scaffoldBackgroundColor: const HSLColor.fromAHSL(1, 0, 0, 0.94).toColor(),
     tooltipTheme: const TooltipThemeData(preferBelow: false),
   );
 }