diff --git a/packages/renderer/src/lib/preferences/PreferencesConnectionDetailsLogs.svelte b/packages/renderer/src/lib/preferences/PreferencesConnectionDetailsLogs.svelte
index 9fa803a2e35d1..d1acc1368368a 100644
--- a/packages/renderer/src/lib/preferences/PreferencesConnectionDetailsLogs.svelte
+++ b/packages/renderer/src/lib/preferences/PreferencesConnectionDetailsLogs.svelte
@@ -102,7 +102,7 @@ onDestroy(() => {
   title="No Log"
   message="Log output"
   hidden="{noLogs === false}"
-  style="background-color: {getPanelDetailColor()}" />
+  class="bg-[var(--pd-details-bg)]" />
 
 <div
   aria-label="terminal"
diff --git a/packages/renderer/src/lib/preferences/PreferencesContainerConnectionDetailsSummary.svelte b/packages/renderer/src/lib/preferences/PreferencesContainerConnectionDetailsSummary.svelte
index b6a2125559f6f..167affc14f96a 100644
--- a/packages/renderer/src/lib/preferences/PreferencesContainerConnectionDetailsSummary.svelte
+++ b/packages/renderer/src/lib/preferences/PreferencesContainerConnectionDetailsSummary.svelte
@@ -35,7 +35,7 @@ $: providerContainerConfiguration = tmpProviderContainerConfiguration.filter(
 );
 </script>
 
-<div class="h-full text-[var(--pd-table-body-text)]">
+<div class="h-full text-[var(--pd-details-body-text)]">
   {#if containerConnectionInfo}
     {@const peerProperties = new PeerProperties()}
     <div class="flex pl-8 py-4 flex-col w-full text-sm">
diff --git a/packages/ui/src/lib/layouts/DetailsPage.svelte b/packages/ui/src/lib/layouts/DetailsPage.svelte
index 59c60ae820dc8..228cae032d51e 100644
--- a/packages/ui/src/lib/layouts/DetailsPage.svelte
+++ b/packages/ui/src/lib/layouts/DetailsPage.svelte
@@ -32,7 +32,7 @@ function handleKeydown(e: KeyboardEvent): void {
 
 <svelte:window on:keydown="{handleKeydown}" />
 
-<div class="flex flex-col w-full h-full shadow-pageheader">
+<div class="flex flex-col w-full h-full shadow-pageheader bg-[var(--pd-content-bg)]">
   <div class="flex flex-row w-full h-fit px-5 pt-4 pb-2">
     <div class="flex flex-col w-full h-fit">
       <div class="flex flew-row items-center text-sm text-[var(--pd-content-breadcrumb)]">