diff --git a/custom_theme_dark.json b/custom_theme_dark.json
new file mode 100644
index 0000000..b534349
--- /dev/null
+++ b/custom_theme_dark.json
@@ -0,0 +1,35 @@
+{
+  "CTk": {
+    "fg_color": ["#121212", "#121212"]
+  },
+  "CTkFrame": {
+    "fg_color": ["#121212", "#121212"]
+  },
+  "CTkLabel": {
+    "text_color": ["#ecd7b2", "#ecd7b2"]
+  },
+  "CTkButton": {
+    "fg_color": ["#21498a", "#21498a"],
+    "hover_color": ["#2a5c9e", "#2a5c9e"]
+  },
+  "CTkEntry": {
+    "fg_color": ["#1e1e1e", "#1e1e1e"],
+    "text_color": ["#ecd7b2", "#ecd7b2"],
+    "placeholder_text_color": ["#888888", "#888888"]
+  },
+  "CTkOptionMenu": {
+    "fg_color": ["#21498a", "#21498a"],
+    "button_color": ["#21498a", "#21498a"],
+    "button_hover_color": ["#2a5c9e", "#2a5c9e"],
+    "text_color": ["#ecd7b2", "#ecd7b2"]
+  },
+  "CTkProgressBar": {
+    "fg_color": ["#1e1e1e", "#1e1e1e"],
+    "progress_color": ["#21498a", "#21498a"]
+  },
+  "CTkSwitch": {
+    "fg_color": ["#1e1e1e", "#1e1e1e"],
+    "progress_color": ["#21498a", "#21498a"],
+    "text_color": ["#ecd7b2", "#ecd7b2"]
+  }
+}
\ No newline at end of file
diff --git a/custom_theme_light.json b/custom_theme_light.json
new file mode 100644
index 0000000..bbeac3e
--- /dev/null
+++ b/custom_theme_light.json
@@ -0,0 +1,35 @@
+{
+  "CTk": {
+    "fg_color": ["#ecd7b2", "#ecd7b2"]
+  },
+  "CTkFrame": {
+    "fg_color": ["#ecd7b2", "#ecd7b2"]
+  },
+  "CTkLabel": {
+    "text_color": ["#000000", "#000000"]
+  },
+  "CTkButton": {
+    "fg_color": ["#4077d1", "#4077d1"],
+    "hover_color": ["#5a8ee6", "#5a8ee6"]
+  },
+  "CTkEntry": {
+    "fg_color": ["#ffffff", "#ffffff"],
+    "text_color": ["#000000", "#000000"],
+    "placeholder_text_color": ["#888888", "#888888"]
+  },
+  "CTkOptionMenu": {
+    "fg_color": ["#4077d1", "#4077d1"],
+    "button_color": ["#4077d1", "#4077d1"],
+    "button_hover_color": ["#5a8ee6", "#5a8ee6"],
+    "text_color": ["#000000", "#000000"]
+  },
+  "CTkProgressBar": {
+    "fg_color": ["#ffffff", "#ffffff"],
+    "progress_color": ["#4077d1", "#4077d1"]
+  },
+  "CTkSwitch": {
+    "fg_color": ["#ffffff", "#ffffff"],
+    "progress_color": ["#4077d1", "#4077d1"],
+    "text_color": ["#000000", "#000000"]
+  }
+}
\ No newline at end of file
diff --git a/gui.py b/gui.py
index 42deeac..084759f 100644
--- a/gui.py
+++ b/gui.py
@@ -19,7 +19,7 @@ class VideoConverterGUI:
 
         # --- Set Dark Mode by Default ---
         customtkinter.set_appearance_mode("Dark")  # Modes: "System", "Dark", "Light"
-        customtkinter.set_default_color_theme("blue")
+        customtkinter.set_default_color_theme(os.path.join(os.path.dirname(__file__), "custom_theme_dark.json"))
 
         # --- Pack bottom elements first ---
         # This makes them stick to the bottom
@@ -91,8 +91,10 @@ class VideoConverterGUI:
         # Check if the switch is on (1) or off (0)
         if self.mode_switch.get() == 1:
             customtkinter.set_appearance_mode("Dark")
+            customtkinter.set_default_color_theme(os.path.join(os.path.dirname(__file__), "custom_theme_dark.json"))
         else:
             customtkinter.set_appearance_mode("Light")
+            customtkinter.set_default_color_theme(os.path.join(os.path.dirname(__file__), "custom_theme_light.json"))
 
     def browse_file(self):
         filepath = filedialog.askopenfilename()
diff --git a/test.css b/test.css
new file mode 100644
index 0000000..5fa75b6
--- /dev/null
+++ b/test.css
@@ -0,0 +1,56 @@
+
+:root {
+  /** Base colors */
+  --clr-dark-a0: #000000;
+  --clr-light-a0: #ffffff;
+
+  /** Theme primary colors */
+  --clr-primary-a0: #759542;
+  --clr-primary-a10: #84a057;
+  --clr-primary-a20: #94ac6b;
+  --clr-primary-a30: #a3b77f;
+  --clr-primary-a40: #b2c394;
+  --clr-primary-a50: #c1cfa9;
+
+  /** Theme surface colors */
+  --clr-surface-a0: #121212;
+  --clr-surface-a10: #282828;
+  --clr-surface-a20: #3f3f3f;
+  --clr-surface-a30: #575757;
+  --clr-surface-a40: #717171;
+  --clr-surface-a50: #8b8b8b;
+
+  /** Theme tonal surface colors */
+  --clr-surface-tonal-a0: #1c1e17;
+  --clr-surface-tonal-a10: #31332c;
+  --clr-surface-tonal-a20: #474943;
+  --clr-surface-tonal-a30: #5f605b;
+  --clr-surface-tonal-a40: #777974;
+  --clr-surface-tonal-a50: #91928e;
+
+  /** Success colors */
+  --clr-success-a0: #22946e;
+  --clr-success-a10: #47d5a6;
+  --clr-success-a20: #9ae8ce;
+
+  /** Warning colors */
+  --clr-warning-a0: #a87a2a;
+  --clr-warning-a10: #d7ac61;
+  --clr-warning-a20: #ecd7b2;
+
+  /** Danger colors */
+  --clr-danger-a0: #9c2121;
+  --clr-danger-a10: #d94a4a;
+  --clr-danger-a20: #eb9e9e;
+
+  /** Info colors */
+  --clr-info-a0: #21498a;
+  --clr-info-a10: #4077d1;
+  --clr-info-a20: #92b2e5;
+}
+
+/** Examples */
+.bg-primary {
+ color: var(--clr-primary-a50);
+ background-color: var(--clr-surface-a0);
+}