diff --git a/pages/edit-otp.go.html b/pages/edit-otp.go.html
index 9e1f2c8..8525fca 100644
--- a/pages/edit-otp.go.html
+++ b/pages/edit-otp.go.html
@@ -2,7 +2,7 @@
 <html lang="en">
 <head>
     <title>{{.ServiceName}}</title>
-    <link rel="stylesheet" href="/theme/dark.css" media="screen and (prefers-color-scheme: dark)">
+    <link rel="stylesheet" href="/theme/style.css">
 </head>
 <body>
 <header>
diff --git a/pages/edit-password.go.html b/pages/edit-password.go.html
index ecb41c3..1ef09c1 100644
--- a/pages/edit-password.go.html
+++ b/pages/edit-password.go.html
@@ -2,7 +2,7 @@
 <html lang="en">
 <head>
     <title>{{.ServiceName}}</title>
-    <link rel="stylesheet" href="/theme/dark.css" media="screen and (prefers-color-scheme: dark)">
+    <link rel="stylesheet" href="/theme/style.css">
 </head>
 <body>
 <header>
diff --git a/pages/edit.go.html b/pages/edit.go.html
index ef26d5c..3686e93 100644
--- a/pages/edit.go.html
+++ b/pages/edit.go.html
@@ -2,7 +2,7 @@
 <html lang="en">
 <head>
     <title>{{.ServiceName}}</title>
-    <link rel="stylesheet" href="/theme/dark.css" media="screen and (prefers-color-scheme: dark)">
+    <link rel="stylesheet" href="/theme/style.css">
 </head>
 <body>
 <header>
diff --git a/pages/index-guest.go.html b/pages/index-guest.go.html
index a584fdc..e4c9927 100644
--- a/pages/index-guest.go.html
+++ b/pages/index-guest.go.html
@@ -2,7 +2,7 @@
 <html lang="en">
 <head>
     <title>{{.ServiceName}}</title>
-    <link rel="stylesheet" href="/theme/dark.css" media="screen and (prefers-color-scheme: dark)">
+    <link rel="stylesheet" href="/theme/style.css">
 </head>
 <body>
 <header>
diff --git a/pages/index.go.html b/pages/index.go.html
index 5283609..fc16b7d 100644
--- a/pages/index.go.html
+++ b/pages/index.go.html
@@ -2,7 +2,7 @@
 <html lang="en">
 <head>
     <title>{{.ServiceName}}</title>
-    <link rel="stylesheet" href="/theme/dark.css" media="screen and (prefers-color-scheme: dark)">
+    <link rel="stylesheet" href="/theme/style.css">
 </head>
 <body>
 <header>
diff --git a/pages/login-otp.go.html b/pages/login-otp.go.html
index e53a1f4..0d3b464 100644
--- a/pages/login-otp.go.html
+++ b/pages/login-otp.go.html
@@ -2,7 +2,7 @@
 <html lang="en">
 <head>
     <title>{{.ServiceName}}</title>
-    <link rel="stylesheet" href="/theme/dark.css" media="screen and (prefers-color-scheme: dark)">
+    <link rel="stylesheet" href="/theme/style.css">
 </head>
 <body>
 <header>
diff --git a/pages/login.go.html b/pages/login.go.html
index e3f9481..07396a2 100644
--- a/pages/login.go.html
+++ b/pages/login.go.html
@@ -2,7 +2,7 @@
 <html lang="en">
 <head>
     <title>{{.ServiceName}}</title>
-    <link rel="stylesheet" href="/theme/dark.css" media="screen and (prefers-color-scheme: dark)">
+    <link rel="stylesheet" href="/theme/style.css">
 </head>
 <body>
 <header>
diff --git a/pages/manage-apps.go.html b/pages/manage-apps.go.html
index 69ca61c..3d05460 100644
--- a/pages/manage-apps.go.html
+++ b/pages/manage-apps.go.html
@@ -2,7 +2,7 @@
 <html lang="en">
 <head>
     <title>{{.ServiceName}}</title>
-    <link rel="stylesheet" href="/theme/dark.css" media="screen and (prefers-color-scheme: dark)">
+    <link rel="stylesheet" href="/theme/style.css">
     <script>
         window.addEventListener("load", function () {
             selectText("app-secret");
diff --git a/pages/manage-users.go.html b/pages/manage-users.go.html
index dc51003..5791b3e 100644
--- a/pages/manage-users.go.html
+++ b/pages/manage-users.go.html
@@ -2,7 +2,7 @@
 <html lang="en">
 <head>
     <title>{{.ServiceName}}</title>
-    <link rel="stylesheet" href="/theme/dark.css" media="screen and (prefers-color-scheme: dark)">
+    <link rel="stylesheet" href="/theme/style.css">
 </head>
 <body>
 <header>
diff --git a/pages/oauth-authorize.go.html b/pages/oauth-authorize.go.html
index 3d1e9b2..00557d3 100644
--- a/pages/oauth-authorize.go.html
+++ b/pages/oauth-authorize.go.html
@@ -2,7 +2,7 @@
 <html lang="en">
 <head>
     <title>{{.ServiceName}}</title>
-    <link rel="stylesheet" href="/theme/dark.css" media="screen and (prefers-color-scheme: dark)">
+    <link rel="stylesheet" href="/theme/style.css">
 </head>
 <body>
 <header>
diff --git a/pages/remove-otp.go.html b/pages/remove-otp.go.html
index 8e714da..22f5997 100644
--- a/pages/remove-otp.go.html
+++ b/pages/remove-otp.go.html
@@ -2,7 +2,7 @@
 <html lang="en">
 <head>
     <title>{{.ServiceName}}</title>
-    <link rel="stylesheet" href="/theme/dark.css" media="screen and (prefers-color-scheme: dark)">
+    <link rel="stylesheet" href="/theme/style.css">
 </head>
 <body>
 <header>
diff --git a/pages/reset-password.go.html b/pages/reset-password.go.html
index da6ad4d..135c3a5 100644
--- a/pages/reset-password.go.html
+++ b/pages/reset-password.go.html
@@ -2,7 +2,7 @@
 <html lang="en">
 <head>
     <title>{{.ServiceName}}</title>
-    <link rel="stylesheet" href="/theme/dark.css" media="screen and (prefers-color-scheme: dark)">
+    <link rel="stylesheet" href="/theme/style.css">
 </head>
 <body>
 <header>
diff --git a/server/server.go b/server/server.go
index efc177c..0de1d9e 100644
--- a/server/server.go
+++ b/server/server.go
@@ -156,8 +156,8 @@ func NewHttpServer(conf Conf, db *database.DB, privKey []byte) *http.Server {
 	}))
 
 	// theme styles
-	r.GET("/theme/dark.css", func(rw http.ResponseWriter, req *http.Request, params httprouter.Params) {
-		http.ServeContent(rw, req, "dark.css", time.Now(), bytes.NewReader(theme.DarkThemeCss))
+	r.GET("/theme/style.css", func(rw http.ResponseWriter, req *http.Request, params httprouter.Params) {
+		http.ServeContent(rw, req, "style.css", time.Now(), bytes.NewReader(theme.ThemeCss))
 	})
 
 	// login steps
diff --git a/theme/dark.css b/theme/dark.css
deleted file mode 100644
index 0a8f10a..0000000
--- a/theme/dark.css
+++ /dev/null
@@ -1,4 +0,0 @@
-html, body {
-    background-color: #242424;
-    color: #eeeeee;
-}
diff --git a/theme/style.css b/theme/style.css
new file mode 100644
index 0000000..d1ee17f
--- /dev/null
+++ b/theme/style.css
@@ -0,0 +1,8 @@
+html, body {
+    color-scheme: light dark;
+}
+
+@media screen and (prefers-color-scheme: dark) {
+    background-color: #242424;
+    color: #eeeeee;
+}
diff --git a/theme/theme.go b/theme/theme.go
index a9dbb5a..3e3e20a 100644
--- a/theme/theme.go
+++ b/theme/theme.go
@@ -2,5 +2,5 @@ package theme
 
 import _ "embed"
 
-//go:embed dark.css
-var DarkThemeCss []byte
+//go:embed style.css
+var ThemeCss []byte
