diff --git a/packages/kbn-dom-drag-drop/src/constants.ts b/packages/kbn-dom-drag-drop/src/constants.ts
index e6b211c314048..997d29f517b13 100644
--- a/packages/kbn-dom-drag-drop/src/constants.ts
+++ b/packages/kbn-dom-drag-drop/src/constants.ts
@@ -8,4 +8,4 @@
 
 export const DEFAULT_DATA_TEST_SUBJ = 'domDragDrop';
 export const REORDER_ITEM_HEIGHT = 32;
-export const REORDER_ITEM_MARGIN = 8;
+export const REORDER_ITEM_MARGIN = 16;
diff --git a/packages/kbn-dom-drag-drop/src/drag_drop.test.tsx b/packages/kbn-dom-drag-drop/src/drag_drop.test.tsx
index fac4b76f2a33d..1fccf59e49269 100644
--- a/packages/kbn-dom-drag-drop/src/drag_drop.test.tsx
+++ b/packages/kbn-dom-drag-drop/src/drag_drop.test.tsx
@@ -1100,12 +1100,12 @@ describe('DragDrop', () => {
       expect(
         component.find('[data-test-subj="testDragDrop-translatableDrop"]').at(0).prop('style')
       ).toEqual({
-        transform: 'translateY(-4px)',
+        transform: 'translateY(-8px)',
       });
       expect(
         component.find('[data-test-subj="testDragDrop-translatableDrop"]').at(1).prop('style')
       ).toEqual({
-        transform: 'translateY(-4px)',
+        transform: 'translateY(-8px)',
       });
 
       component
@@ -1258,7 +1258,7 @@ describe('DragDrop', () => {
       expect(
         component.find('[data-test-subj="testDragDrop-reorderableDrag"]').at(0).prop('style')
       ).toEqual({
-        transform: 'translateY(+4px)',
+        transform: 'translateY(+8px)',
       });
       expect(
         component.find('[data-test-subj="testDragDrop-translatableDrop"]').at(0).prop('style')
diff --git a/packages/kbn-dom-drag-drop/src/sass/drag_drop.scss b/packages/kbn-dom-drag-drop/src/sass/drag_drop.scss
index 56ce648266e7b..fecd5ee6bfbe0 100644
--- a/packages/kbn-dom-drag-drop/src/sass/drag_drop.scss
+++ b/packages/kbn-dom-drag-drop/src/sass/drag_drop.scss
@@ -15,7 +15,7 @@
   width: 100%;
   left: 0;
   opacity: .9;
-  transform: translate($euiSizeXS, $euiSizeXS);
+  transform: translate($euiSizeS, $euiSizeL);
   z-index: $domDragDropZLevel3;
   pointer-events: none;
   outline: $euiFocusRingSize solid currentColor; // Safari & Firefox
@@ -138,6 +138,10 @@ $reorderItemMargin: $euiSizeS;
   }
 }
 
+.domDragDrop--isDragStarted {
+  opacity: .5;
+}
+
 // Draggable item when it is moving
 .domDragDrop-isHidden {
   opacity: 0;
@@ -149,10 +153,6 @@ $reorderItemMargin: $euiSizeS;
   }
 }
 
-.domDragDrop--isDragStarted {
-  opacity: .5;
-}
-
 .domDragDrop__extraDrops {
   opacity: 0;
   visibility: hidden;