diff --git a/source/Component/Container/Container.scss b/source/Component/Container/Container.scss
index 2714068..9f2da00 100644
--- a/source/Component/Container/Container.scss
+++ b/source/Component/Container/Container.scss
@@ -143,13 +143,28 @@ div.dark.app-container.end-containe {
 		background-color: $lt-bg-color-lvl4-dark;
 		color: rgba($color: #FFFFFF, $alpha: .85);
 	}
+
+    div.app-tab-header-item.deep.tab,
+	div.app-tab-header-item.deep.active,
+	div.app-tab-header-item.deep:hover {
+        background-color: $lt-bg-color-lvl5-dark;
+    }
 	
+    div.app-tab-header-item.tab,
 	div.app-tab-header-item.active {
-		div.border-view::after {
-			background-color: $lt-bg-color-lvl4-dark;
-			transition: none;
-		}
-	}
+        div.border-view::after {
+            background-color: $lt-bg-color-lvl4-dark;
+            transition: none;
+        }
+    }
+    
+    div.app-tab-header-item.deep.tab,
+	div.app-tab-header-item.deep.active {
+        div.border-view::after {
+            background-color: $lt-bg-color-lvl5-dark;
+            transition: none;
+        }
+    }
 
 	div.app-panel::-webkit-scrollbar-thumb {
 		background-color: $lt-bg-color-lvl1-dark;
@@ -163,15 +178,31 @@ div.light.app-container.end-containe {
 	div.app-tab-header-item.active,
 	div.app-tab-header-item:hover {
 		transition: none;
+		background-color: $lt-bg-color-lvl4-light;
 		color: rgba($color: #000000, $alpha: .85);
 	}
 
+    div.app-tab-header-item.deep.tab,
+	div.app-tab-header-item.deep.active,
+	div.app-tab-header-item.deep:hover {
+        background-color: $lt-bg-color-lvl5-light;
+    }
+	
+    div.app-tab-header-item.tab,
 	div.app-tab-header-item.active {
-		div.border-view::after {
-			background-color: $lt-bg-color-lvl4-light;
-			transition: none;
-		}
-	}
+        div.border-view::after {
+            background-color: $lt-bg-color-lvl4-light;
+            transition: none;
+        }
+    }
+    
+    div.app-tab-header-item.deep.tab,
+	div.app-tab-header-item.deep.active {
+        div.border-view::after {
+            background-color: $lt-bg-color-lvl5-light;
+            transition: none;
+        }
+    }
 
 	div.app-panel::-webkit-scrollbar-thumb {
 		background-color: $lt-bg-color-lvl1-light;
diff --git a/source/Component/Container/Container.tsx b/source/Component/Container/Container.tsx
index 40d8d35..268b35b 100644
--- a/source/Component/Container/Container.tsx
+++ b/source/Component/Container/Container.tsx
@@ -59,6 +59,7 @@ class Container extends Component<IContainerProps> {
 						if (panelId === this.props.focusId) classList.push("active");
 						if (panelId === showPanelId) classList.push("tab");
 						const panelInfo = getPanelInfoById(panelId as any);
+                        if (panelInfo?.isDeepDark) classList.push("deep");
 
 						return <LocalizationTooltipHost
 							i18nKey={panelInfo ? panelInfo.introKay as any : "Panel.Info.Notfound"}
@@ -110,23 +111,23 @@ class Container extends Component<IContainerProps> {
 
 		if (this.props.onScaleChange && this.focusEdgeId !== undefined) {
 			e.preventDefault();
-			let mouveDist: number = 0;
+			let moveDist: number = 0;
 			let rootSize: number = 0;
 			let edgeSize: number = 0;
 			let newSize: number = 0;
 
 			if (this.edgeInfo.direction === LayoutDirection.X) {
-				mouveDist = e.clientX - this.edgeInfo.mouseX;
+				moveDist = e.clientX - this.edgeInfo.mouseX;
 				rootSize = this.edgeInfo.rootWidth;
 				edgeSize = this.edgeInfo.edgeWidth;
-				newSize = edgeSize + mouveDist;
+				newSize = edgeSize + moveDist;
 			}
 
 			if (this.edgeInfo.direction === LayoutDirection.Y) {
-				mouveDist = e.clientY - this.edgeInfo.mouseY;
+				moveDist = e.clientY - this.edgeInfo.mouseY;
 				rootSize = this.edgeInfo.rootHeight;
 				edgeSize = this.edgeInfo.edgeHeight
-				newSize = edgeSize + mouveDist;	
+				newSize = edgeSize + moveDist;	
 			}
 
 			if (newSize < 38) { newSize = 38; }
diff --git a/source/Panel/Panel.tsx b/source/Panel/Panel.tsx
index 8defca0..b9605f0 100644
--- a/source/Panel/Panel.tsx
+++ b/source/Panel/Panel.tsx
@@ -9,6 +9,7 @@ interface IPanelInfo {
 	class: (new (...p: any) => Component) | FunctionComponent;
 	hidePadding?: boolean;
 	hideScrollBar?: boolean;
+    isDeepDark?: boolean;
 	option?: Record<string, string>;
 }
 
@@ -18,7 +19,8 @@ type PanelId = ""
 
 const PanelInfoMap = new Map<PanelId, IPanelInfo>();
 PanelInfoMap.set("RenderView", { 
-	nameKey: "Panel.Title.Render.View", introKay: "Panel.Info.Render.View", class: RenderView, hidePadding: true, hideScrollBar: true
+	nameKey: "Panel.Title.Render.View", introKay: "Panel.Info.Render.View",
+    class: RenderView, hidePadding: true, hideScrollBar: true, isDeepDark: true
 });
 
 function getPanelById(panelId: PanelId): ReactNode {