diff --git a/blocksuite/affine/blocks/note/src/note-edgeless-block.ts b/blocksuite/affine/blocks/note/src/note-edgeless-block.ts
index 2f59756286..639bd0a185 100644
--- a/blocksuite/affine/blocks/note/src/note-edgeless-block.ts
+++ b/blocksuite/affine/blocks/note/src/note-edgeless-block.ts
@@ -221,6 +221,12 @@ export class EdgelessNoteBlockComponent extends toGfxBlockComponent(
     }
   }
 
+  override getCSSScaleVal(): number {
+    const baseScale = super.getCSSScaleVal();
+    const extraScale = this.model.props.edgeless?.scale ?? 1;
+    return baseScale * extraScale;
+  }
+
   override getRenderingRect() {
     const { xywh, edgeless } = this.model.props;
     const { collapse, scale = 1 } = edgeless;
@@ -255,7 +261,6 @@ export class EdgelessNoteBlockComponent extends toGfxBlockComponent(
 
     const style = {
       borderRadius: borderRadius + 'px',
-      transform: `scale(${scale})`,
     };
 
     const extra = this._editing ? ACTIVE_NOTE_EXTRA_PADDING : 0;
diff --git a/blocksuite/framework/std/src/view/element/gfx-block-component.ts b/blocksuite/framework/std/src/view/element/gfx-block-component.ts
index 2c7af40b88..d957c41101 100644
--- a/blocksuite/framework/std/src/view/element/gfx-block-component.ts
+++ b/blocksuite/framework/std/src/view/element/gfx-block-component.ts
@@ -105,6 +105,12 @@ export abstract class GfxBlockComponent<
 
   onBoxSelected(_: BoxSelectionContext) {}
 
+  getCSSScaleVal(): number {
+    const viewport = this.gfx.viewport;
+    const { zoom, viewScale } = viewport;
+    return zoom / viewScale;
+  }
+
   getCSSTransform() {
     const viewport = this.gfx.viewport;
     const { translateX, translateY, zoom, viewScale } = viewport;
@@ -115,7 +121,7 @@ export abstract class GfxBlockComponent<
     const deltaX = scaledX - bound.x;
     const deltaY = scaledY - bound.y;
 
-    return `translate(${translateX / viewScale + deltaX}px, ${translateY / viewScale + deltaY}px) scale(${zoom / viewScale})`;
+    return `translate(${translateX / viewScale + deltaX}px, ${translateY / viewScale + deltaY}px) scale(${this.getCSSScaleVal()})`;
   }
 
   getRenderingRect() {
@@ -219,6 +225,10 @@ export function toGfxBlockComponent<
       handleGfxConnection(this);
     }
 
+    getCSSScaleVal(): number {
+      return GfxBlockComponent.prototype.getCSSScaleVal.call(this);
+    }
+
     getCSSTransform() {
       return GfxBlockComponent.prototype.getCSSTransform.call(this);
     }
diff --git a/tests/blocksuite/e2e/edgeless/note/scale.spec.ts b/tests/blocksuite/e2e/edgeless/note/scale.spec.ts
index 01de79fb6e..bbb1da409f 100644
--- a/tests/blocksuite/e2e/edgeless/note/scale.spec.ts
+++ b/tests/blocksuite/e2e/edgeless/note/scale.spec.ts
@@ -49,14 +49,13 @@ async function checkNoteScale(
   const edgelessNote = page.locator(
     `affine-edgeless-note[data-block-id="${noteId}"]`
   );
-  const noteContainer = edgelessNote.getByTestId('edgeless-note-container');
-  const style = await noteContainer.getAttribute('style');
+  const style = await edgelessNote.getAttribute('style');
 
   if (!style) {
     throw new Error('Style attribute not found');
   }
 
-  const scaleMatch = style.match(/transform:\s*scale\(([\d.]+)\)/);
+  const scaleMatch = style.match(/transform:[^;]*scale\(([\d.]+)\)/);
   if (!scaleMatch) {
     throw new Error('Scale transform not found in style');
   }