diff --git a/app/listen/layout.tsx b/app/listen/layout.tsx
index 05c7194..c9c3e24 100644
--- a/app/listen/layout.tsx
+++ b/app/listen/layout.tsx
@@ -1,6 +1,6 @@
 export default function ListenLayout({ children }: { children: React.ReactNode}) {
     return (
-        <main className="min-h-screen bg-gradient-to-b from-slate-300 to-cyan-800 dark:from-black dark:to-cyan-900">
+        <main className="min-h-screen bg-gradient-to-b from-slate-300 to-cyan-800 dark:from-black dark:to-cyan-900 text-black dark:text-white">
             { children }
         </main>
     )
diff --git a/app/projects/layout.tsx b/app/projects/layout.tsx
index 7a6c41e..1e8f0fd 100644
--- a/app/projects/layout.tsx
+++ b/app/projects/layout.tsx
@@ -1,6 +1,6 @@
 export default function ProjectsLayout({ children }: { children: React.ReactNode }) {
     return (
-        <div className="min-h-screen bg-gradient-to-b from-slate-300 to-sky-700 dark:from-black dark:to-green-950">
+        <div className="min-h-screen bg-gradient-to-b from-slate-300 to-sky-700 dark:from-black dark:to-green-950 text-black dark:text-white">
             { children }
         </div>
     )
diff --git a/app/read/layout.tsx b/app/read/layout.tsx
index c95f6e6..afcd642 100644
--- a/app/read/layout.tsx
+++ b/app/read/layout.tsx
@@ -1,6 +1,6 @@
 export default function ReadSectionLayout({ children }: { children: React.ReactNode }) {
     return (
-        <div className="min-h-screen bg-gradient-to-b from-slate-300 to-fuchsia-100 dark:from-black dark:to-fuchsia-900">
+        <div className="min-h-screen bg-gradient-to-b from-slate-300 to-fuchsia-100 dark:from-black dark:to-fuchsia-900 text-black dark:text-white">
             { children }
         </div>
     )