diff --git a/packages/block-editor/src/components/inserter/library.js b/packages/block-editor/src/components/inserter/library.js
index a3a4e7feb42b32..7e9b366e5e3a74 100644
--- a/packages/block-editor/src/components/inserter/library.js
+++ b/packages/block-editor/src/components/inserter/library.js
@@ -24,6 +24,7 @@ function InserterLibrary(
 		__experimentalOnPatternCategorySelection,
 		onSelect = noop,
 		shouldFocusBlock = false,
+		onClose,
 	},
 	ref
 ) {
@@ -54,6 +55,7 @@ function InserterLibrary(
 			}
 			shouldFocusBlock={ shouldFocusBlock }
 			ref={ ref }
+			onClose={ onClose }
 		/>
 	);
 }
diff --git a/packages/block-editor/src/components/inserter/menu.js b/packages/block-editor/src/components/inserter/menu.js
index 7e3ae9c7a85f7e..979a3b8199f0b0 100644
--- a/packages/block-editor/src/components/inserter/menu.js
+++ b/packages/block-editor/src/components/inserter/menu.js
@@ -47,6 +47,7 @@ function InserterMenu(
 		__experimentalFilterValue = '',
 		shouldFocusBlock = true,
 		__experimentalOnPatternCategorySelection = NOOP,
+		onClose,
 	},
 	ref
 ) {
@@ -301,7 +302,11 @@ function InserterMenu(
 			ref={ ref }
 		>
 			<div className="block-editor-inserter__main-area">
-				<InserterTabs ref={ tabsRef } onSelect={ handleSetSelectedTab }>
+				<InserterTabs
+					ref={ tabsRef }
+					onSelect={ handleSetSelectedTab }
+					onClose={ onClose }
+				>
 					{ inserterSearch }
 					{ selectedTab === 'blocks' &&
 						! delayedFilterValue &&
diff --git a/packages/block-editor/src/components/inserter/style.scss b/packages/block-editor/src/components/inserter/style.scss
index bf9d184b81843f..1258fe01b285d6 100644
--- a/packages/block-editor/src/components/inserter/style.scss
+++ b/packages/block-editor/src/components/inserter/style.scss
@@ -116,7 +116,7 @@ $block-inserter-tabs-height: 44px;
 	overflow: hidden;
 
 	.block-editor-inserter__tablist {
-		border-bottom: $border-width solid $gray-300;
+		width: 100%;
 
 		button[role="tab"] {
 			flex-grow: 1;
diff --git a/packages/block-editor/src/components/inserter/tabs.js b/packages/block-editor/src/components/inserter/tabs.js
index 5506e3c315cbdf..c1486dda6dbf27 100644
--- a/packages/block-editor/src/components/inserter/tabs.js
+++ b/packages/block-editor/src/components/inserter/tabs.js
@@ -1,9 +1,13 @@
 /**
  * WordPress dependencies
  */
-import { privateApis as componentsPrivateApis } from '@wordpress/components';
+import {
+	Button,
+	privateApis as componentsPrivateApis,
+} from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 import { forwardRef } from '@wordpress/element';
+import { closeSmall } from '@wordpress/icons';
 
 /**
  * Internal dependencies
@@ -29,23 +33,33 @@ const mediaTab = {
 	title: __( 'Media' ),
 };
 
-function InserterTabs( { onSelect, children }, ref ) {
+function InserterTabs( { onSelect, children, onClose }, ref ) {
 	const tabs = [ blocksTab, patternsTab, mediaTab ];
 
 	return (
 		<div className="block-editor-inserter__tabs" ref={ ref }>
 			<Tabs onSelect={ onSelect }>
-				<Tabs.TabList className="block-editor-inserter__tablist">
-					{ tabs.map( ( tab ) => (
-						<Tabs.Tab
-							key={ tab.name }
-							tabId={ tab.name }
-							className="block-editor-inserter__tab"
-						>
-							{ tab.title }
-						</Tabs.Tab>
-					) ) }
-				</Tabs.TabList>
+				<div className="block-editor-inserter-sidebar__header">
+					<Button
+						className="block-editor-inserter-sidebar__close-button"
+						icon={ closeSmall }
+						label={ __( 'Close block inserter' ) }
+						onClick={ () => onClose() }
+						size="small"
+					/>
+
+					<Tabs.TabList className="block-editor-inserter__tablist">
+						{ tabs.map( ( tab ) => (
+							<Tabs.Tab
+								key={ tab.name }
+								tabId={ tab.name }
+								className="block-editor-inserter__tab"
+							>
+								{ tab.title }
+							</Tabs.Tab>
+						) ) }
+					</Tabs.TabList>
+				</div>
 				{ tabs.map( ( tab ) => (
 					<Tabs.TabPanel
 						key={ tab.name }
diff --git a/packages/editor/src/components/inserter-sidebar/index.js b/packages/editor/src/components/inserter-sidebar/index.js
index 7135742b214681..2863ef5e1eb22e 100644
--- a/packages/editor/src/components/inserter-sidebar/index.js
+++ b/packages/editor/src/components/inserter-sidebar/index.js
@@ -2,14 +2,11 @@
  * WordPress dependencies
  */
 import { useDispatch, useSelect } from '@wordpress/data';
-import { Button, VisuallyHidden } from '@wordpress/components';
-import { close } from '@wordpress/icons';
 import {
 	__experimentalLibrary as Library,
 	store as blockEditorStore,
 } from '@wordpress/block-editor';
 import { useViewportMatch } from '@wordpress/compose';
-import { __ } from '@wordpress/i18n';
 import { useRef } from '@wordpress/element';
 import { store as preferencesStore } from '@wordpress/preferences';
 
@@ -50,18 +47,10 @@ export default function InserterSidebar( {
 	const { setIsInserterOpened } = useDispatch( editorStore );
 
 	const isMobileViewport = useViewportMatch( 'medium', '<' );
-	const TagName = ! isMobileViewport ? VisuallyHidden : 'div';
 	const libraryRef = useRef();
 
 	return (
 		<div className="editor-inserter-sidebar">
-			<TagName className="editor-inserter-sidebar__header">
-				<Button
-					icon={ close }
-					label={ __( 'Close block inserter' ) }
-					onClick={ () => setIsInserterOpened( false ) }
-				/>
-			</TagName>
 			<div className="editor-inserter-sidebar__content">
 				<Library
 					showMostUsedBlocks={ showMostUsedBlocks }
@@ -78,6 +67,7 @@ export default function InserterSidebar( {
 						isRightSidebarOpen ? closeGeneralSidebar : undefined
 					}
 					ref={ libraryRef }
+					onClose={ () => setIsInserterOpened( false ) }
 				/>
 			</div>
 		</div>
diff --git a/packages/editor/src/components/inserter-sidebar/style.scss b/packages/editor/src/components/inserter-sidebar/style.scss
index 6077db9c9feff1..e3564cbd03aafe 100644
--- a/packages/editor/src/components/inserter-sidebar/style.scss
+++ b/packages/editor/src/components/inserter-sidebar/style.scss
@@ -6,11 +6,16 @@
 	flex-direction: column;
 }
 
-.editor-inserter-sidebar__header {
-	padding-top: $grid-unit-10;
+.block-editor-inserter-sidebar__header {
+	border-bottom: $border-width solid $gray-300;
 	padding-right: $grid-unit-10;
 	display: flex;
-	justify-content: flex-end;
+	justify-content: space-between;
+
+	.block-editor-inserter-sidebar__close-button {
+		order: 1;
+		align-self: center;
+	}
 }
 
 .editor-inserter-sidebar__content {