diff --git a/backend/package.json b/backend/package.json
index 843f011f6..7439db8cd 100644
--- a/backend/package.json
+++ b/backend/package.json
@@ -26,6 +26,7 @@
 		]
 	},
 	"scripts": {
+		"frontend": "npm run frontend:install && npm run frontend:build && npm run frontend:copy",
 		"frontend:install": "cd ../frontend && npm i",
 		"frontend:build": "cd ../frontend && npm run build",
 		"frontend:copy": "webpack --mode none --config copy.frontend.webpack.config.js",
diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index c6aa34018..c3892f362 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -309,7 +309,7 @@ export default {
 #app {
   height: 100%;
   color: var(--vscode-foreground, #cccccc);
-  background-color: var(--vscode-panel-background, #303031);
+  background-color: var(--vscode-editor-inactiveSelectionBackground, #3a3d41);
   font-family: var(--vscode-font-family);
   font-weight: var(--vscode-font-weight);
   font-size: var(--vscode-font-size);
@@ -317,7 +317,7 @@ export default {
 html,
 body {
   height: 100%;
-  background-color: var(--vscode-panel-background, #303031);
+  background-color: var(--vscode-editor-inactiveSelectionBackground, #3a3d41);
   padding: 0px;
 }
 .list-group-item.selected {
diff --git a/frontend/src/components/Navigation.vue b/frontend/src/components/Navigation.vue
index e37290754..19974287b 100644
--- a/frontend/src/components/Navigation.vue
+++ b/frontend/src/components/Navigation.vue
@@ -28,8 +28,8 @@ export default {
   padding-right: 0.5em;
   padding-top: 0.2em;
   padding-bottom: 0.2em;
-  background-color: var(--vscode-sideBar-background, #252526);
-  border-color: var(--vscode-sideBar-background, #252526);
+  background-color: var(--vscode-editorWidget-background, #252526);
+  border-color: var(--vscode-editorWidget-background, #252526);
   color: var(--vscode-foreground, #cccccc);
   cursor: default;
 }
diff --git a/frontend/src/components/QuestionTypes/GeneratorSelection.vue b/frontend/src/components/QuestionTypes/GeneratorSelection.vue
index b62a28fa5..12e436a4b 100644
--- a/frontend/src/components/QuestionTypes/GeneratorSelection.vue
+++ b/frontend/src/components/QuestionTypes/GeneratorSelection.vue
@@ -83,7 +83,7 @@ export default {
   border-width: 1px;
   border-radius: 0px;
   border-color: var(--vscode-list-activeSelectionForeground, white);
-  background-color: var(--vscode-notifications-border, #1e1e1e);
+  background-color: var(--vscode-editor-background, #1e1e1e);
 }
 
 .card.generator:hover:not(.selected) {