diff --git a/src/app/index.tsx b/src/app/index.tsx
index 0d6b304..9f4b6d4 100644
--- a/src/app/index.tsx
+++ b/src/app/index.tsx
@@ -269,7 +269,8 @@ const Index = () => {
           <TopMenu />
           <div
             className={
-              'h-fit dark:bg-black' + (page !== 'list' ? ' hidden' : '')
+              'h-fit bg-[rgb(246,246,246)] dark:bg-black' +
+              (page !== 'list' ? ' hidden' : '')
             }
           >
             <div className="p-4">
@@ -292,7 +293,7 @@ const Index = () => {
             />
           </div>
           {page !== 'list' && (
-            <div className="h-fit min-h-full p-4 dark:bg-black">
+            <div className="h-fit min-h-full p-4 bg-[rgb(246,246,246)] dark:bg-black">
               <ProfessorOverview
                 professor={convertToProfOnly(page)}
                 grades={grades[searchQueryLabel(convertToProfOnly(page))]}
diff --git a/src/components/Landing.tsx b/src/components/Landing.tsx
index 661ee6b..e76a8e4 100644
--- a/src/components/Landing.tsx
+++ b/src/components/Landing.tsx
@@ -25,7 +25,7 @@ const ExplanatoryPage = ({
   next?: number;
 }) => {
   return (
-    <div className="h-full w-full flex flex-col dark:bg-black">
+    <div className="h-full w-full flex flex-col bg-[rgb(246,246,246)] dark:bg-black">
       <img
         src={src}
         alt="tutorial descriptive"