diff --git a/packages/dockview-core/src/dnd/droptarget.scss b/packages/dockview-core/src/dnd/droptarget.scss
index 9baf55508..d03cf502a 100644
--- a/packages/dockview-core/src/dnd/droptarget.scss
+++ b/packages/dockview-core/src/dnd/droptarget.scss
@@ -22,26 +22,26 @@
             will-change: transform;
             pointer-events: none;
 
-            &.dv-overlay-top {
-                &.dv-overlay-small-vertical {
+            &.dv-droptarget-top {
+                &.dv-droptarget-small-vertical {
                     border-top: 1px solid var(--dv-drag-over-border-color);
                 }
             }
 
-            &.dv-overlay-bottom {
-                &.dv-overlay-small-vertical {
+            &.dv-droptarget-bottom {
+                &.dv-droptarget-small-vertical {
                     border-bottom: 1px solid var(--dv-drag-over-border-color);
                 }
             }
 
-            &.dv-overlay-left {
-                &.dv-overlay-small-horizontal {
+            &.dv-droptarget-left {
+                &.dv-droptarget-small-horizontal {
                     border-left: 1px solid var(--dv-drag-over-border-color);
                 }
             }
 
-            &.dv-overlay-right {
-                &.dv-overlay-small-horizontal {
+            &.dv-droptarget-right {
+                &.dv-droptarget-small-horizontal {
                     border-right: 1px solid var(--dv-drag-over-border-color);
                 }
             }
diff --git a/packages/dockview-core/src/dnd/droptarget.ts b/packages/dockview-core/src/dnd/droptarget.ts
index f607f2cc7..47b15c303 100644
--- a/packages/dockview-core/src/dnd/droptarget.ts
+++ b/packages/dockview-core/src/dnd/droptarget.ts
@@ -279,16 +279,25 @@ export class Droptarget extends CompositeDisposable {
 
         this.overlayElement.style.transform = transform;
 
-        toggleClass(this.overlayElement, 'dv-overlay-small-vertical', isSmallY);
         toggleClass(
             this.overlayElement,
-            'dv-overlay-small-horizontal',
+            'dv-droptarget-small-vertical',
+            isSmallY
+        );
+        toggleClass(
+            this.overlayElement,
+            'dv-droptarget-small-horizontal',
             isSmallX
         );
-        toggleClass(this.overlayElement, 'dv-overlay-left', isLeft);
-        toggleClass(this.overlayElement, 'dv-overlay-right', isRight);
-        toggleClass(this.overlayElement, 'dv-overlay-top', isTop);
-        toggleClass(this.overlayElement, 'dv-overlay-bottom', isBottom);
+        toggleClass(this.overlayElement, 'dv-droptarget-left', isLeft);
+        toggleClass(this.overlayElement, 'dv-droptarget-right', isRight);
+        toggleClass(this.overlayElement, 'dv-droptarget-top', isTop);
+        toggleClass(this.overlayElement, 'dv-droptarget-bottom', isBottom);
+        toggleClass(
+            this.overlayElement,
+            'dv-droptarget-center',
+            quadrant === 'center'
+        );
     }
 
     private calculateQuadrant(