diff --git a/frontend/app/element/copybutton.less b/frontend/app/element/copybutton.less
index 24dec9e82..2c0f96427 100644
--- a/frontend/app/element/copybutton.less
+++ b/frontend/app/element/copybutton.less
@@ -5,6 +5,6 @@
     padding: 5px 5px;
 
     .fa-check {
-        color: var(--app-success-color);
+        color: var(--success-color);
     }
 }
diff --git a/frontend/app/element/markdown.less b/frontend/app/element/markdown.less
index 1f72e18fd..288bee119 100644
--- a/frontend/app/element/markdown.less
+++ b/frontend/app/element/markdown.less
@@ -45,12 +45,12 @@
     blockquote {
         margin: 4px 10px 4px 10px;
         border-radius: 3px;
-        background-color: var(--markdown-bg-color);
+        background-color: var(--panel-bg-color);
         padding: 2px 4px 2px 6px;
     }
 
     pre.codeblock {
-        background-color: var(--markdown-bg-color);
+        background-color: var(--panel-bg-color);
         margin: 4px 10px;
         padding: 0.4em 0.7em;
         border-radius: 4px;
@@ -90,7 +90,7 @@
                 }
 
                 &.fa-check {
-                    color: var(--app-success-color);
+                    color: var(--success-color);
                 }
 
                 &.fa-square-terminal {
@@ -106,13 +106,13 @@
 
     code {
         color: var(--app-text-color);
-        background-color: var(--markdown-bg-color);
+        background-color: var(--panel-bg-color);
         font-family: var(--termfontfamily);
         border-radius: 4px;
     }
 
     pre.selected {
-        outline: 2px solid var(--markdown-outline-color);
+        outline: 2px solid var(--accent-color);
     }
 
     .title {
diff --git a/frontend/app/element/typingindicator.less b/frontend/app/element/typingindicator.less
index 31a2ed650..b12a12f3d 100644
--- a/frontend/app/element/typingindicator.less
+++ b/frontend/app/element/typingindicator.less
@@ -1,5 +1,5 @@
 @dot-width: 11px;
-@dot-color: var(--app-success-color);
+@dot-color: var(--success-color);
 @speed: 1.5s;
 
 .typing {
diff --git a/frontend/app/theme.less b/frontend/app/theme.less
index 6d0b06c78..f8788adae 100644
--- a/frontend/app/theme.less
+++ b/frontend/app/theme.less
@@ -36,25 +36,4 @@
     /* z-index values */
     --zindex-header-hover: 100;
     --zindex-termstickers: 20;
-
-    /* global colors */
-    --app-text-primary-color: rgb(255, 255, 255);
-    --app-text-color: rgb(211, 215, 207);
-    --app-border-color: rgb(51, 51, 51);
-    --app-panel-bg-color-dev: rgb(21, 23, 48);
-    --app-panel-bg-color: rgba(21, 23, 21, 1);
-    --app-accent-color: rgb(88, 193, 66);
-
-    /* global status colors */
-    --app-success-color: rgb(78, 154, 6);
-
-    /* form element colors */
-    --form-element-primary-color: var(--app-accent-color);
-
-    /* markdown colors */
-    --markdown-bg-color: rgb(35, 35, 35);
-    --markdown-outline-color: var(--form-element-primary-color);
-
-    /* cmdinput colors */
-    --cmdinput-text-error-color: var(--term-red);
 }
diff --git a/frontend/app/view/waveai.less b/frontend/app/view/waveai.less
index d56e0ce4a..7d90eceab 100644
--- a/frontend/app/view/waveai.less
+++ b/frontend/app/view/waveai.less
@@ -78,10 +78,10 @@
         padding: 16px 15px 7px;
         flex: 0 0 auto;
         flex-shrink: 0;
-        border-top: 1px solid var(--app-border-color);
+        border-top: 1px solid var(--border-color);
 
         .waveai-input {
-            color: var(--app-text-primary-color);
+            color: var(--main-text-color);
             background-color: var(--cmdinput-textarea-bg);
             resize: none;
             width: 100%;
diff --git a/frontend/app/view/waveai.tsx b/frontend/app/view/waveai.tsx
index 288434be4..0193a21df 100644
--- a/frontend/app/view/waveai.tsx
+++ b/frontend/app/view/waveai.tsx
@@ -3,7 +3,6 @@
 
 import { Markdown } from "@/app/element/markdown";
 import { TypingIndicator } from "@/app/element/typingindicator";
-import { getApi } from "@/app/store/global";
 import { ChatMessageType, useWaveAi } from "@/app/store/waveai";
 import type { OverlayScrollbars } from "overlayscrollbars";
 import { OverlayScrollbarsComponent, OverlayScrollbarsComponentRef } from "overlayscrollbars-react";
@@ -12,7 +11,7 @@ import tinycolor from "tinycolor2";
 
 import "./waveai.less";
 
-const outline = "2px solid var(--markdown-outline-color)";
+const outline = "2px solid var(--accent-color)";
 
 interface ChatItemProps {
     chatItem: ChatMessageType;
@@ -23,7 +22,7 @@ const ChatItem = ({ chatItem, itemCount }: ChatItemProps) => {
     const { isAssistant, text, isError } = chatItem;
     const senderClassName = isAssistant ? "chat-msg-assistant" : "chat-msg-user";
     const msgClassName = `chat-msg ${senderClassName}`;
-    const cssVar = getApi().isDev ? "--app-panel-bg-color-dev" : "--app-panel-bg-color";
+    const cssVar = "--panel-bg-color";
     const panelBgColor = getComputedStyle(document.documentElement).getPropertyValue(cssVar).trim();
     const color = tinycolor(panelBgColor);
     const newColor = color.isValid() ? tinycolor(panelBgColor).darken(6).toString() : "none";