diff --git a/editor/src/components/canvas/controls/select-mode/absolute-resize-control.tsx b/editor/src/components/canvas/controls/select-mode/absolute-resize-control.tsx
index 10c7e4b2929e..0afe912106ee 100644
--- a/editor/src/components/canvas/controls/select-mode/absolute-resize-control.tsx
+++ b/editor/src/components/canvas/controls/select-mode/absolute-resize-control.tsx
@@ -2,9 +2,10 @@ import React from 'react'
 import { MetadataUtils } from '../../../../core/model/element-metadata-utils'
 import * as EP from '../../../../core/shared/element-path'
 import type { ElementInstanceMetadataMap } from '../../../../core/shared/element-template'
-import type { CanvasVector } from '../../../../core/shared/math-utils'
+import type { CanvasRectangle, CanvasVector } from '../../../../core/shared/math-utils'
 import {
   boundingRectangleArray,
+  canvasRectangle,
   isInfinityRectangle,
   nullIfInfinity,
   windowPoint,
@@ -32,7 +33,7 @@ import { controlForStrategyMemoized } from '../../canvas-strategies/canvas-strat
 import { createInteractionViaMouse } from '../../canvas-strategies/interaction-state'
 import type { EdgePosition } from '../../canvas-types'
 import { CSSCursor } from '../../canvas-types'
-import { windowToCanvasCoordinates } from '../../dom-lookup'
+import { getAllTargetsUnderAreaAABB, windowToCanvasCoordinates } from '../../dom-lookup'
 import { SmallElementSize, useBoundingBox } from '../bounding-box-hooks'
 import { CanvasOffsetWrapper } from '../canvas-offset-wrapper'
 import { isZeroSizedElement } from '../outline-utils'
@@ -47,6 +48,7 @@ interface AbsoluteResizeControlProps {
   targets: Array<ElementPath>
 }
 
+export const SizeLabelID = 'SizeLabel'
 export const SizeLabelTestId = 'SizeLabelTestId'
 
 function shouldUseSmallElementResizeControl(size: number, scale: number): boolean {
@@ -146,7 +148,6 @@ export const AbsoluteResizeControl = controlForStrategyMemoized(
           ref={controlRef}
           style={{
             position: 'absolute',
-            pointerEvents: 'none',
           }}
         >
           <ResizeEdge
@@ -429,6 +430,7 @@ export type SizeLabelContents = SizeLabelSize | SizeLabelGroup
 function sizeLabelContents(
   metadata: ElementInstanceMetadataMap,
   selectedElements: Array<ElementPath>,
+  boundingBox: CanvasRectangle | null,
 ): SizeLabelContents | null {
   if (selectedElements.length === 0) {
     return null
@@ -459,9 +461,6 @@ function sizeLabelContents(
     )
   }
 
-  const boundingBox = boundingRectangleArray(
-    selectedElements.map((t) => nullIfInfinity(MetadataUtils.getFrameInCanvasCoords(t, metadata))),
-  )
   if (boundingBox != null) {
     return sizeLabelWithDimensions(`${boundingBox.width}`, `${boundingBox.height}`)
   }
@@ -508,15 +507,60 @@ const SizeLabel = React.memo(
       'ResizeLabel metadata',
     )
 
-    const label = sizeLabelContents(metadata, targets)
+    const boundingBox = boundingRectangleArray(
+      targets.map((t) => nullIfInfinity(MetadataUtils.getFrameInCanvasCoords(t, metadata))),
+    )
+
+    const label = sizeLabelContents(metadata, targets, boundingBox)
     const labelText = getLabelText(label)
 
+    const [dimmed, setDimmed] = React.useState(false)
+
+    const editorRef = useRefEditorState((store) => ({
+      scale: store.editor.canvas.scale,
+      offset: store.editor.canvas.roundedCanvasOffset,
+      jsxMetadata: store.editor.jsxMetadata,
+      elementPathTree: store.editor.elementPathTree,
+      allElementProps: store.editor.allElementProps,
+      hiddenInstances: store.editor.hiddenInstances,
+    }))
+
+    const onMouseEnter = React.useCallback(() => {
+      const distanceBetweenBoxAndLabel = 10 // px
+      const labelRect = document.getElementById(SizeLabelID)?.getBoundingClientRect()
+      if (boundingBox != null && labelRect != null) {
+        const area = canvasRectangle({
+          x: boundingBox.x + (boundingBox.width - labelRect.width) / 2,
+          y:
+            boundingBox.y +
+            boundingBox.height +
+            distanceBetweenBoxAndLabel / editorRef.current.scale,
+          width: labelRect.width,
+          height: labelRect.height,
+        })
+        const elementsUnderLabel = getAllTargetsUnderAreaAABB(
+          editorRef.current.jsxMetadata,
+          [],
+          editorRef.current.hiddenInstances,
+          'no-filter',
+          area,
+          editorRef.current.elementPathTree,
+          editorRef.current.allElementProps,
+          true,
+        )
+        setDimmed(elementsUnderLabel.length > 0)
+      }
+    }, [editorRef, boundingBox])
+
+    const onMouseLeave = React.useCallback(() => {
+      setDimmed(false)
+    }, [])
+
     return (
       <div
         ref={ref}
         style={{
           position: 'absolute',
-          pointerEvents: 'none',
           display: 'flex',
           justifyContent: 'center',
         }}
@@ -525,6 +569,7 @@ const SizeLabel = React.memo(
         {when(
           labelText != null,
           <div
+            id={SizeLabelID}
             data-testid={SizeLabelTestId}
             style={{
               display: 'flex',
@@ -536,7 +581,11 @@ const SizeLabel = React.memo(
               backgroundColor: colorTheme.primary.value,
               fontSize: FontSize / scale,
               height: ExplicitHeightHacked / scale,
+              opacity: dimmed ? 0.075 : 1,
+              transition: '0.1s',
             }}
+            onMouseEnter={onMouseEnter}
+            onMouseLeave={onMouseLeave}
           >
             {labelText}
           </div>,