diff --git a/packages/block-editor/src/components/block-canvas/style.scss b/packages/block-editor/src/components/block-canvas/style.scss
index 2dc9e32d7a393c..d3dee1ff9ee94c 100644
--- a/packages/block-editor/src/components/block-canvas/style.scss
+++ b/packages/block-editor/src/components/block-canvas/style.scss
@@ -2,12 +2,5 @@ iframe[name="editor-canvas"] {
 	width: 100%;
 	height: 100%;
 	display: block;
-}
-
-iframe[name="editor-canvas"]:not(.has-editor-padding) {
 	background-color: $white;
 }
-
-iframe[name="editor-canvas"].has-editor-padding {
-	padding: $grid-unit-30 $grid-unit-30 0;
-}
diff --git a/packages/edit-post/src/components/visual-editor/index.js b/packages/edit-post/src/components/visual-editor/index.js
index 74dffb35fcd273..48621d7f49adae 100644
--- a/packages/edit-post/src/components/visual-editor/index.js
+++ b/packages/edit-post/src/components/visual-editor/index.js
@@ -31,11 +31,14 @@ export default function VisualEditor( { styles } ) {
 		isBlockBasedTheme,
 		hasV3BlocksOnly,
 		isEditingTemplate,
+		isEditingPattern,
 	} = useSelect( ( select ) => {
 		const { isFeatureActive } = select( editPostStore );
-		const { getEditorSettings, getRenderingMode } = select( editorStore );
+		const { getEditorSettings, getRenderingMode, getCurrentPostType } =
+			select( editorStore );
 		const { getBlockTypes } = select( blocksStore );
 		const editorSettings = getEditorSettings();
+		const currentPostType = getCurrentPostType();
 
 		return {
 			isWelcomeGuideVisible: isFeatureActive( 'welcomeGuide' ),
@@ -44,8 +47,8 @@ export default function VisualEditor( { styles } ) {
 			hasV3BlocksOnly: getBlockTypes().every( ( type ) => {
 				return type.apiVersion >= 3;
 			} ),
-			isEditingTemplate:
-				select( editorStore ).getCurrentPostType() === 'wp_template',
+			isEditingPattern: currentPostType === 'wp_block',
+			isEditingTemplate: currentPostType === 'wp_template',
 		};
 	}, [] );
 	const hasMetaBoxes = useSelect(
@@ -83,6 +86,7 @@ export default function VisualEditor( { styles } ) {
 		<div
 			className={ classnames( 'edit-post-visual-editor', {
 				'has-inline-canvas': ! isToBeIframed,
+				'is-focus-mode': isEditingPattern || isEditingTemplate,
 			} ) }
 		>
 			<EditorCanvas
diff --git a/packages/edit-post/src/components/visual-editor/style.scss b/packages/edit-post/src/components/visual-editor/style.scss
index 8ad587d4e5a580..5534da1998c285 100644
--- a/packages/edit-post/src/components/visual-editor/style.scss
+++ b/packages/edit-post/src/components/visual-editor/style.scss
@@ -36,6 +36,12 @@
 	// as align-items: stretch is inherited by default.Additionally due to older browser's flex height
 	// interpretation, any percentage value is likely going to cause issues, such as metaboxes overlapping.
 	// See also https://www.w3.org/TR/CSS22/visudet.html#the-height-property.
+
+	// Matches `.is-focus-mode` padding in
+	// packages/edit-site/src/components/block-editor/style.scss.
+	&.is-focus-mode {
+		padding: $grid-unit-30;
+	}
 }
 
 .edit-post-visual-editor__content-area {
diff --git a/packages/edit-site/src/components/block-editor/style.scss b/packages/edit-site/src/components/block-editor/style.scss
index fa7fd7e13df3e4..47a86a24ca37d9 100644
--- a/packages/edit-site/src/components/block-editor/style.scss
+++ b/packages/edit-site/src/components/block-editor/style.scss
@@ -26,14 +26,6 @@
 	// Centralize the editor horizontally (flex-direction is column).
 	align-items: center;
 
-	// Controls height of editor and editor canvas container (style book, global styles revisions previews etc.)
-	iframe {
-		display: block;
-		width: 100%;
-		height: 100%;
-		background: $white;
-	}
-
 	.edit-site-visual-editor__editor-canvas {
 		&.is-focused {
 			outline: calc(2 * var(--wp-admin-border-width-focus)) solid var(--wp-admin-theme-color);
diff --git a/packages/editor/src/components/editor-canvas/index.js b/packages/editor/src/components/editor-canvas/index.js
index bc7d54583afbda..e80e70e24db5f2 100644
--- a/packages/editor/src/components/editor-canvas/index.js
+++ b/packages/editor/src/components/editor-canvas/index.js
@@ -103,7 +103,6 @@ function EditorCanvas( {
 		wrapperBlockName,
 		wrapperUniqueId,
 		deviceType,
-		showEditorPadding,
 		isDesignPostType,
 	} = useSelect( ( select ) => {
 		const {
@@ -152,8 +151,6 @@ function EditorCanvas( {
 			wrapperBlockName: _wrapperBlockName,
 			wrapperUniqueId: getCurrentPostId(),
 			deviceType: getDeviceType(),
-			showEditorPadding:
-				!! editorSettings.onNavigateToPreviousEntityRecord,
 		};
 	}, [] );
 	const { isCleanNewPost } = useSelect( editorStore );
@@ -324,9 +321,7 @@ function EditorCanvas( {
 			styles={ styles }
 			height="100%"
 			iframeProps={ {
-				className: classnames( 'editor-canvas__iframe', {
-					'has-editor-padding': showEditorPadding,
-				} ),
+				className: 'editor-canvas__iframe',
 				...iframeProps,
 				style: {
 					...iframeProps?.style,