diff --git a/README.md b/README.md
index 7eed167..b74dc4d 100644
--- a/README.md
+++ b/README.md
@@ -118,13 +118,14 @@ of your `config.toml`:
 [extra]
 
 # One of: blue, green, orange, pink, red.
-# Defaults to blue. 
+# Defaults to blue.
+# Append -light for light themes, e.g. blue-light
+# Or append -auto, e.g. blue-auto
 accent_color = "green"
 
-# One of: blue, dark, green, orange, pink, red.
-# Enabling dark background will also modify primary font color
-# to be darker.
-# Defaults to accent color (or, if not accent color specified, to blue). 
+# One of: blue, dark, green, orange, pink, red, light, auto
+# Enabling dark background will also modify primary font color to be darker.
+# Defaults to accent color (or, if not accent color specified, to blue).
 background_color = "dark"
 ```
 
diff --git a/config.toml b/config.toml
index 2a5b87d..80337c9 100644
--- a/config.toml
+++ b/config.toml
@@ -25,11 +25,12 @@ highlight_theme = "boron"
 
 # One of: blue, green, orange, pink, red.
 # Defaults to blue.
+# Append -light for light themes, e.g. blue-light
+# Or append -auto, e.g. blue-auto
 accent_color = "blue"
 
-# One of: blue, dark, green, orange, pink, red.
-# Enabling dark background will also modify primary font color
-# to be darker.
+# One of: blue, dark, green, orange, pink, red, light, auto
+# Enabling dark background will also modify primary font color to be darker.
 # Defaults to accent color (or, if not accent color specified, to blue).
 background_color = "blue"
 
diff --git a/sass/color/background_auto.scss b/sass/color/background_auto.scss
new file mode 100644
index 0000000..e1cab79
--- /dev/null
+++ b/sass/color/background_auto.scss
@@ -0,0 +1,14 @@
+:root {
+
+  @media (prefers-color-scheme: light) {
+    --background: white;
+  
+    --color: #101010;
+  }
+
+  @media (prefers-color-scheme: dark) {
+    --background: #101010;
+  
+    --color: #A9B7C6;
+  }
+}
diff --git a/sass/color/background_light.scss b/sass/color/background_light.scss
new file mode 100644
index 0000000..ac41318
--- /dev/null
+++ b/sass/color/background_light.scss
@@ -0,0 +1,3 @@
+:root {
+  --background: #f0f0f0;
+}
diff --git a/sass/color/blue-auto.scss b/sass/color/blue-auto.scss
new file mode 100644
index 0000000..bf20e33
--- /dev/null
+++ b/sass/color/blue-auto.scss
@@ -0,0 +1,29 @@
+:root {
+  @media (prefers-color-scheme: dark) {
+    --accent: rgb(35,176,255);
+    --accent-alpha-70: rgba(35,176,255,.7);
+    --accent-alpha-20: rgba(35,176,255,.2);
+
+    --background: #101010;
+    --color: #f0f0f0;
+    --border-color: rgba(255,240,224,.125);
+
+    div.logo {
+      color: black;
+    }
+  
+  }
+  @media (prefers-color-scheme: light) {
+    --accent: rgb(32,128,192);
+    --accent-alpha-70: rgba(32,128,192,.7);
+    --accent-alpha-20: rgba(32,128,192,.2);
+
+    --background: white;
+    --color: #201030;
+    --border-color: rgba(0,0,16,.125);
+    
+    div.logo {
+      color: white;
+    }
+  }
+}
diff --git a/sass/color/blue-light.scss b/sass/color/blue-light.scss
new file mode 100644
index 0000000..c41d839
--- /dev/null
+++ b/sass/color/blue-light.scss
@@ -0,0 +1,12 @@
+:root {
+  --accent: rgb(32,128,192);
+  --accent-alpha-70: rgba(32,128,192,.7);
+  --accent-alpha-20: rgba(32,128,192,.2);
+
+  --background: white;
+  --color: #1D212C;
+  --border-color: rgba(0, 0, 0, .1);
+  div.logo {
+    color: white;
+  }
+}
diff --git a/sass/color/green-auto.scss b/sass/color/green-auto.scss
new file mode 100644
index 0000000..2eb5e12
--- /dev/null
+++ b/sass/color/green-auto.scss
@@ -0,0 +1,29 @@
+:root {
+  @media (prefers-color-scheme: dark) {
+    --accent: rgb(120,226,160);
+    --accent-alpha-70: rgba(120,226,160,.7);
+    --accent-alpha-20: rgba(120,226,160,.2);
+  
+    --background: #101010;
+    --color: #f0f0f0;
+    --border-color: rgba(255,240,224,.125);
+    
+    div.logo {
+      color: black;
+    }
+  
+  }
+  @media (prefers-color-scheme: light) {
+    --accent: rgb(24, 192, 128);
+    --accent-alpha-70: rgba(24, 192, 128,.7);
+    --accent-alpha-20: rgba(24, 192, 128,.2);
+
+    --background: white;
+    --color: #201030;
+    --border-color: rgba(0,0,16,.125);
+    
+    div.logo {
+      color: white;
+    }
+  }
+}
diff --git a/sass/color/green-light.scss b/sass/color/green-light.scss
new file mode 100644
index 0000000..9ee64f3
--- /dev/null
+++ b/sass/color/green-light.scss
@@ -0,0 +1,12 @@
+:root {
+  --accent: rgb(24, 192, 128);
+  --accent-alpha-70: rgba(24, 192, 128,.7);
+  --accent-alpha-20: rgba(24, 192, 128,.2);
+
+  --background: white;
+  --color: #1D212C;
+  --border-color: rgba(0, 0, 0, .1);
+  div.logo {
+    color: white;
+  }
+}
diff --git a/sass/color/orange-auto.scss b/sass/color/orange-auto.scss
new file mode 100644
index 0000000..3c19ce4
--- /dev/null
+++ b/sass/color/orange-auto.scss
@@ -0,0 +1,29 @@
+:root {
+  @media (prefers-color-scheme: dark) {
+    --accent: rgb(255,168,106);
+    --accent-alpha-70: rgba(255,168,106,.7);
+    --accent-alpha-20: rgba(255,168,106,.2);
+  
+    --background: #101010;
+    --color: #f0f0f0;
+    --border-color: rgba(255,240,224,.125);
+    
+    div.logo {
+      color: black;
+    }
+  
+  }
+  @media (prefers-color-scheme: light) {
+    --accent: rgb(240,128,48);
+    --accent-alpha-70: rgba(240,128,48,.7);
+    --accent-alpha-20: rgba(240,128,48,.2);
+  
+    --background: white;
+    --color: #201030;
+    --border-color: rgba(0,0,16,.125);
+
+    div.logo {
+      color: white;
+    }
+  }
+}
diff --git a/sass/color/orange-light.scss b/sass/color/orange-light.scss
new file mode 100644
index 0000000..6f7b8f9
--- /dev/null
+++ b/sass/color/orange-light.scss
@@ -0,0 +1,12 @@
+:root {
+  --accent: rgb(240,128,48);
+  --accent-alpha-70: rgba(240,128,48,.7);
+  --accent-alpha-20: rgba(240,128,48,.2);
+
+  --background: white;
+  --color: #1D212C;
+  --border-color: rgba(0, 0, 0, .1);
+  div.logo {
+    color: white;
+  }
+}
\ No newline at end of file
diff --git a/sass/color/pink-auto.scss b/sass/color/pink-auto.scss
new file mode 100644
index 0000000..705c706
--- /dev/null
+++ b/sass/color/pink-auto.scss
@@ -0,0 +1,29 @@
+:root {
+  @media (prefers-color-scheme: dark) {
+    --accent: rgb(224,64,192);
+    --accent-alpha-70: rgba(224,64,192);
+    --accent-alpha-20: rgba(224,64,192,.2);
+
+    --background: #101010;
+    --color: #f0f0f0;
+    --border-color: rgba(255,240,224,.125);
+    
+    div.logo {
+      color: black;
+    }
+  
+  }
+  @media (prefers-color-scheme: light) {
+    --accent: rgb(238,114,241);
+    --accent-alpha-70: rgba(238,114,241,.7);
+    --accent-alpha-20: rgba(238,114,241,.2);
+  
+    --background: white;
+    --color: #201030;
+    --border-color: rgba(0,0,16,.125);
+    
+    div.logo {
+      color: white;
+    }
+  }
+}
diff --git a/sass/color/pink-light.scss b/sass/color/pink-light.scss
new file mode 100644
index 0000000..aa8437c
--- /dev/null
+++ b/sass/color/pink-light.scss
@@ -0,0 +1,12 @@
+:root {
+  --accent: rgb(224,64,192);
+  --accent-alpha-70: rgba(224,64,192);
+  --accent-alpha-20: rgba(224,64,192,.2);
+
+  --background: white;
+  --color: #1D212C;
+  --border-color: rgba(0, 0, 0, .1);
+  div.logo {
+    color: white;
+  }
+}
diff --git a/sass/color/red-auto.scss b/sass/color/red-auto.scss
new file mode 100644
index 0000000..a0016f2
--- /dev/null
+++ b/sass/color/red-auto.scss
@@ -0,0 +1,29 @@
+:root {
+  @media (prefers-color-scheme: dark) {
+    --accent: rgb(255,98,102);
+    --accent-alpha-70: rgba(255,98,102,.7);
+    --accent-alpha-20: rgba(255,98,102,.2);
+
+    --background: #101010;
+    --color: #f0f0f0;
+    --border-color: rgba(255,240,224,.125);
+    
+    div.logo {
+      color: black;
+    }
+  
+  }
+  @media (prefers-color-scheme: light) {
+    --accent: rgb(240,48,64);
+    --accent-alpha-70: rgba(240,48,64,.7);
+    --accent-alpha-20: rgba(240,48,64,.2);
+  
+    --background: white;
+    --color: #201030;
+    --border-color: rgba(0,0,16,.125);
+    
+    div.logo {
+      color: white;
+    }
+  }
+}
diff --git a/sass/color/red-light.scss b/sass/color/red-light.scss
new file mode 100644
index 0000000..d2f0e4c
--- /dev/null
+++ b/sass/color/red-light.scss
@@ -0,0 +1,12 @@
+:root {
+  --accent: rgb(240,48,64);
+  --accent-alpha-70: rgba(240,48,64,.7);
+  --accent-alpha-20: rgba(240,48,64,.2);
+
+  --background: white;
+  --color: #1D212C;
+  --border-color: rgba(0, 0, 0, .1);
+  div.logo {
+    color: white;
+  }
+}
diff --git a/theme.toml b/theme.toml
index 5bcbdb0..5dbccf7 100644
--- a/theme.toml
+++ b/theme.toml
@@ -20,11 +20,13 @@ repo = "https://github.com/panr/hugo-theme-terminal"
 [extra]
 
 # One of: blue, green, orange, pink, red.
+# Defaults to blue.
+# Append -light for light themes, e.g. blue-light
+# Or append -auto, e.g. blue-auto
 accent_color = "blue"
 
-# One of: blue, dark, green, orange, pink, red.
-# Enabling dark background will also modify primary font color
-# to be darker.
+# One of: blue, dark, green, orange, pink, red, light, auto
+# Enabling dark background will also modify primary font color to be darker.
 # Defaults to accent color (or, if not accent color specified, to blue).
 background_color = "blue"