diff --git a/config/global.ini b/config/global.ini
index c18de94a..55743f4e 100644
--- a/config/global.ini
+++ b/config/global.ini
@@ -26,6 +26,10 @@ A propos = "about.php"
 2 = "Responsable"
 3 = "Directeur"
 
-[themes]
-0 = '@media (prefers-color-scheme: dark) {.body {--text: hsl(0, 0%, 80%);--background: hsl(0, 0%, 15%);--banner-background: hsl(0, 0%, 10%);--buttons: hsl(0, 0%, 5%);}} @media (prefers-color-scheme: light) {.body {--text: hsl(0, 0%, 20%);--background: hsl(0, 0%, 100%);--banner-background: hsl(0, 0%, 100%);--buttons: hsl(0, 0%, 100%);}}'
+[themes-dark]
+0 = '--text: hsl(0, 0%, 80%);--background: hsl(0, 0%, 15%);--banner-background: hsl(0, 0%, 10%);--buttons: hsl(0, 0%, 5%)'
+1 = '--text: hsl(208, 100%, 4%); --background: hsl(215, 21%, 88%); --banner-background: hsl(216, 28%, 93%); --buttons: hsl(216, 28%, 93%)'
+
+[themes-light]
+0 = '--text: hsl(0, 0%, 20%);--background: hsl(0, 0%, 100%);--banner-background: hsl(0, 0%, 100%);--buttons: hsl(0, 0%, 100%)'
 1 = '--text: hsl(208, 100%, 96%); --background: hsl(215, 21%, 11%); --banner-background: hsl(216, 28%, 7%); --buttons: hsl(216, 28%, 7%)'
\ No newline at end of file
diff --git a/html/about.php b/html/about.php
index 090c0369..08e90347 100644
--- a/html/about.php
+++ b/html/about.php
@@ -9,7 +9,18 @@ require "../include/functions.php";
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link rel="stylesheet" href="./src/css/style.css">
-    <style>.body {<?=$theme?>}</style>
+    <style>
+    @media (prefers-color-scheme: dark) {
+        .body {
+            <?=$theme_dark?>
+        }
+    } 
+    @media (prefers-color-scheme: light) {
+        .body {
+            <?=$theme_light?>
+            }
+        }
+    </style>
     <link rel="icon" href="src/img/favicon.ico">
     <title><?=$title?></title>
 </head>
diff --git a/html/admin.php b/html/admin.php
index e9495a11..bfca2f0e 100644
--- a/html/admin.php
+++ b/html/admin.php
@@ -15,7 +15,18 @@ if($_SESSION['role'] < 3) {
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link rel="stylesheet" href="./src/css/style.css">
-    <style>.body {<?=$theme?>}</style>
+    <style>
+    @media (prefers-color-scheme: dark) {
+        .body {
+            <?=$theme_dark?>
+        }
+    } 
+    @media (prefers-color-scheme: light) {
+        .body {
+            <?=$theme_light?>
+            }
+        }
+    </style>
     <link rel="icon" href="src/img/favicon.ico">
     <title><?=$title?></title>
 </head>
diff --git a/html/compte.php b/html/compte.php
index e82b1ff1..96e58c47 100644
--- a/html/compte.php
+++ b/html/compte.php
@@ -28,7 +28,18 @@ if(isset($_POST['delete_account'])) {
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link rel="stylesheet" href="./src/css/style.css">
-    <style>.body {<?=$theme?>}</style>
+    <style>
+    @media (prefers-color-scheme: dark) {
+        .body {
+            <?=$theme_dark?>
+        }
+    } 
+    @media (prefers-color-scheme: light) {
+        .body {
+            <?=$theme_light?>
+            }
+        }
+    </style>
     <link rel="icon" href="src/img/favicon.ico">
     <title><?=$title?></title>
 </head>
diff --git a/html/editpage.php b/html/editpage.php
index 5069f280..b6b04abf 100644
--- a/html/editpage.php
+++ b/html/editpage.php
@@ -61,7 +61,18 @@ if(isset($fichier)) {
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link rel="stylesheet" href="./src/css/style.css">
-    <style>.body {<?=$theme?>}</style>
+    <style>
+    @media (prefers-color-scheme: dark) {
+        .body {
+            <?=$theme_dark?>
+        }
+    } 
+    @media (prefers-color-scheme: light) {
+        .body {
+            <?=$theme_light?>
+            }
+        }
+    </style>
     <link rel="icon" href="src/img/favicon.ico">
     <title><?=$title?></title>
     <style>
diff --git a/html/index.php b/html/index.php
index a7712a6e..eb9b956e 100644
--- a/html/index.php
+++ b/html/index.php
@@ -9,7 +9,18 @@ require "../include/functions.php";
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link rel="stylesheet" href="./src/css/style.css">
-    <style>.body {<?=$theme?>}</style>
+    <style>
+    @media (prefers-color-scheme: dark) {
+        .body {
+            <?=$theme_dark?>
+        }
+    } 
+    @media (prefers-color-scheme: light) {
+        .body {
+            <?=$theme_light?>
+            }
+        }
+    </style>
     <link rel="icon" href="src/img/favicon.ico">
     <title><?=$title?></title>
 </head>
diff --git a/html/login.php b/html/login.php
index e4607dd3..18852d94 100644
--- a/html/login.php
+++ b/html/login.php
@@ -40,7 +40,18 @@ if(isset($_POST['username']) && isset($_POST['password'])) {
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link rel="stylesheet" href="./src/css/style.css">
-    <style>.body {<?=$theme?>}</style>
+    <style>
+    @media (prefers-color-scheme: dark) {
+        .body {
+            <?=$theme_dark?>
+        }
+    } 
+    @media (prefers-color-scheme: light) {
+        .body {
+            <?=$theme_light?>
+            }
+        }
+    </style>
     <link rel="icon" href="src/img/favicon.ico">
     <title><?=$title?></title>
 </head>
diff --git a/html/news.php b/html/news.php
index 3154f7e7..f45cd649 100644
--- a/html/news.php
+++ b/html/news.php
@@ -14,7 +14,18 @@ if (filter_var($_GET['article'], FILTER_VALIDATE_INT)) {
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link rel="stylesheet" href="./src/css/style.css">
-    <style>.body {<?=$theme?>}</style>
+    <style>
+    @media (prefers-color-scheme: dark) {
+        .body {
+            <?=$theme_dark?>
+        }
+    } 
+    @media (prefers-color-scheme: light) {
+        .body {
+            <?=$theme_light?>
+            }
+        }
+    </style>
     <link rel="icon" href="src/img/favicon.ico">
     <title><?=$title?></title>
 </head>
diff --git a/html/register.php b/html/register.php
index 51e870e2..58f506de 100644
--- a/html/register.php
+++ b/html/register.php
@@ -40,7 +40,18 @@ if(isset($_POST['username']) && isset($_POST['password']) && isset($_POST['passw
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link rel="stylesheet" href="./src/css/style.css">
-    <style>.body {<?=$theme?>}</style>
+    <style>
+    @media (prefers-color-scheme: dark) {
+        .body {
+            <?=$theme_dark?>
+        }
+    } 
+    @media (prefers-color-scheme: light) {
+        .body {
+            <?=$theme_light?>
+            }
+        }
+    </style>
     <link rel="icon" href="src/img/favicon.ico">
     <title><?=$title?></title>
 </head>
diff --git a/html/upload.php b/html/upload.php
index d1b22923..54c98efd 100644
--- a/html/upload.php
+++ b/html/upload.php
@@ -38,7 +38,18 @@ if(isset($_POST['page-content'])) {
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link rel="stylesheet" href="./src/css/style.css">
-    <style>.body {<?=$theme?>}</style>
+    <style>
+    @media (prefers-color-scheme: dark) {
+        .body {
+            <?=$theme_dark?>
+        }
+    } 
+    @media (prefers-color-scheme: light) {
+        .body {
+            <?=$theme_light?>
+            }
+        }
+    </style>
     <link rel="icon" href="src/img/favicon.ico">
     <title><?=$title?></title>
     <style>
diff --git a/html/users.php b/html/users.php
index ab29d829..79e4d718 100644
--- a/html/users.php
+++ b/html/users.php
@@ -29,7 +29,18 @@ if(isset($_POST['userid']) && isset($_POST['role']) && isset($_POST['accreditati
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link rel="stylesheet" href="./src/css/style.css">
-    <style>.body {<?=$theme?>}</style>
+    <style>
+    @media (prefers-color-scheme: dark) {
+        .body {
+            <?=$theme_dark?>
+        }
+    } 
+    @media (prefers-color-scheme: light) {
+        .body {
+            <?=$theme_light?>
+            }
+        }
+    </style>
     <link rel="icon" href="src/img/favicon.ico">
     <title><?=$title?></title>
 </head>
diff --git a/include/functions.php b/include/functions.php
index 0c3b93f3..c3d4c8c2 100644
--- a/include/functions.php
+++ b/include/functions.php
@@ -13,7 +13,8 @@ if(isset($_GET['theme'])) {
     setcookie('theme', (int)$_GET['theme'] % 2, time()+10*60*60);
 }
 
-$theme = $themes[$_COOKIE['theme']];
+$theme_dark = $themes_dark[$_COOKIE['theme']];
+$theme_light = $themes_light[$_COOKIE['theme']];
 
 
 function nav($nav) {
diff --git a/include/variables.php b/include/variables.php
index 5a6cb80f..e3b2b11b 100644
--- a/include/variables.php
+++ b/include/variables.php
@@ -15,5 +15,6 @@ $navadmin = $nav;
 $status = "";
 $classifications = $config['classifications'];
 $roles = $config['roles'];
-$themes = $config['themes'];
+$themes_dark = $config['themes_dark'];
+$themes_light = $config['themes_light'];
 ?>
\ No newline at end of file