diff --git a/compose.yml b/compose.yml
index eac9611..3f53b06 100644
--- a/compose.yml
+++ b/compose.yml
@@ -47,7 +47,9 @@ services:
       - media:/media
       - assets:/web/dist/assets
       - templates:/templates
-      - webdist:/web/dist
+    configs:
+      - source: custom_css
+        target: /web/dist/custom.css
     networks:
       - internal
       - proxy
@@ -178,7 +180,6 @@ networks:
 
 volumes:
   backups:
-  webdist:
   media:
   templates:
   assets:
diff --git a/custom.css.tmpl b/custom.css.tmpl
new file mode 100644
index 0000000..780eb76
--- /dev/null
+++ b/custom.css.tmpl
@@ -0,0 +1,24 @@
+/* my custom css */
+
+
+:root {
+    --ak-accent: #fd4b2d;
+
+    --ak-dark-foreground: #fafafa;
+    --ak-dark-foreground-darker: #bebebe;
+    --ak-dark-foreground-link: #5a5cb9;
+    --ak-dark-background: #18191a;
+    --ak-dark-background-darker: #000000;
+
+
+    --ak-dark-background-light: {{ env "AUTHENTIK_COLOR_BACKGROUND_LIGHT" }};
+    --ak-dark-background-light-ish: #212427;
+    --ak-dark-background-lighter: #2b2e33;
+
+    --pf-c-background-image--BackgroundImage: var(--ak-flow-background);
+    --pf-c-background-image--BackgroundImage-2x: var(--ak-flow-background);
+    --pf-c-background-image--BackgroundImage--sm: var(--ak-flow-background);
+    --pf-c-background-image--BackgroundImage--sm-2x: var(--ak-flow-background);
+    --pf-c-background-image--BackgroundImage--lg: var(--ak-flow-background);
+}
+