diff --git a/extensions/workspace-indicator/meson.build b/extensions/workspace-indicator/meson.build
index 6dd08dae..dada5408 100644
--- a/extensions/workspace-indicator/meson.build
+++ b/extensions/workspace-indicator/meson.build
@@ -7,6 +7,9 @@ extension_data += configure_file(
   output: metadata_name,
   configuration: metadata_conf
 )
-extension_data += files('stylesheet.css')
+extension_data += files(
+  'stylesheet-dark.css',
+  'stylesheet-light.css',
+)
 
 extension_sources += files('prefs.js', 'workspaceIndicator.js')
diff --git a/extensions/workspace-indicator/stylesheet.css b/extensions/workspace-indicator/stylesheet-dark.css
similarity index 100%
rename from extensions/workspace-indicator/stylesheet.css
rename to extensions/workspace-indicator/stylesheet-dark.css
diff --git a/extensions/workspace-indicator/stylesheet-light.css b/extensions/workspace-indicator/stylesheet-light.css
new file mode 100644
index 00000000..049b6a38
--- /dev/null
+++ b/extensions/workspace-indicator/stylesheet-light.css
@@ -0,0 +1,25 @@
+/*
+ * SPDX-FileCopyrightText: 2013 Florian Müllner <fmuellner@gnome.org>
+ * SPDX-FileCopyrightText: 2015 Jakub Steiner <jimmac@gmail.com>
+ *
+ * SPDX-License-Identifier: GPL-2.0-or-later
+ */
+
+@import url("stylesheet-dark.css");
+
+.workspace-indicator .workspace {
+  background-color: #ccc;
+}
+
+.workspace-indicator .workspace.active {
+  border-color: #888;
+}
+
+.workspace-indicator-window-preview {
+  background-color: #ededed;
+  border: 1px solid #ccc;
+}
+
+.workspace-indicator-window-preview.active {
+  background-color: #f6f5f4;
+}