diff --git a/client/screens/Alarms.tsx b/client/screens/Alarms.tsx
index c4f36bd..fd8ce5e 100644
--- a/client/screens/Alarms.tsx
+++ b/client/screens/Alarms.tsx
@@ -77,6 +77,7 @@ export default function Alarms() {
     : textStyles.buttonText;
 
   return (
+    <View style={[styles.container, dynamicStyles]}>
     <ScrollView>
       <Text style={{ ...textStyles.titleText, padding: 20, color: dynamicStyles.color }}>
         Alarm Clock
@@ -96,5 +97,6 @@ export default function Alarms() {
 
       <StatusBar />
     </ScrollView>
+    </View>
   );
 }
diff --git a/client/screens/Home.tsx b/client/screens/Home.tsx
index 71054b6..95de02f 100644
--- a/client/screens/Home.tsx
+++ b/client/screens/Home.tsx
@@ -26,6 +26,7 @@ export default function Home() {
   const dynamicStyles = {
     backgroundColor: isDarkMode ? 'darkgrey' : 'white',
     color: isDarkMode ? 'white' : 'black',
+    buttonColor: isDarkMode ? 'dimgrey' : 'white',
   };
 
   const addNewTimeZone = (zone: TimeZone) => {
@@ -104,7 +105,7 @@ export default function Home() {
             <TouchableOpacity onPress={() => removeTimeZone(index)} style={styles.deleteButton}>
               <Text style={styles.deleteButtonText}>Delete</Text>
             </TouchableOpacity>
-            <View style={[styles.box, { backgroundColor: dynamicStyles.backgroundColor }]}>
+            <View style={[styles.box, { backgroundColor: dynamicStyles.buttonColor }]}>
               <Text style={{ ...styles.time, color: dynamicStyles.color }}>
                 {formatDate(currentTime, zone)}
               </Text>