diff --git a/frontend/src/app.html b/frontend/src/app.html
index 7e5c060..929e4b5 100644
--- a/frontend/src/app.html
+++ b/frontend/src/app.html
@@ -9,7 +9,7 @@
 </head>
 
 <body data-sveltekit-preload-data="hover" style="width: 100vw; height: 100vh;">
-	<div style="display: contents; width: 100vw; height: 100vh;">%sveltekit.body%</div>
+	<div style="display: contents; width: 100vw; height: 100vh;" class="bg-base-100">%sveltekit.body%</div>
 	<div class="dropdown mb-72" style="position: absolute; left: auto; right: 3vw; top: 10px; bottom: auto">
 		<div tabindex="0" role="button" class="btn m-1">
 			Theme
diff --git a/frontend/src/routes/+page.svelte b/frontend/src/routes/+page.svelte
index 344c091..c698ada 100644
--- a/frontend/src/routes/+page.svelte
+++ b/frontend/src/routes/+page.svelte
@@ -40,8 +40,8 @@
 
 <div style="height:100vh;">
 	<SvelteFlowProvider>
-		<SvelteFlow {nodes} {nodeTypes} {edges} class="bg-base-100" fitView onlyRenderVisibleElements>
-			<Controls />
+		<SvelteFlow {nodes} {nodeTypes} {edges} class="bg-base-100" fitView=True onlyRenderVisibleElements=True>
+			<Controls class="bg-base-300 text-primary-content"/>
 			<MiniMap />
 		</SvelteFlow>
 	</SvelteFlowProvider>
