@@ -12,7 +12,7 @@ import HtmlRenderer from '../../../utils/html-renderer';
 export default function IconGrid( { icons, onChange, attributes } ) {
 	return (
 		<div className="wp-block-icon__inserter-grid">
-			{ icons.length === 0 ? (
+			{ ! icons?.length ? (
 				<div className="wp-block-icon__inserter-grid-no-results">
 					<p>{ __( 'No results found.' ) }</p>
 				</div>
 
@@ -13,7 +13,7 @@ import IconGrid from './icon-grid';
 import { normalizeSearchInput } from '../../../utils/search-patterns';
 
 export default function CustomInserterModal( {
-	icons,
+	icons = [],
 	setInserterOpen,
 	attributes,
 	setAttributes,
 
@@ -25,18 +25,17 @@ import {
 	__experimentalGetSpacingClassesAndStyles as useSpacingProps,
 	getDimensionsClassesAndStyles as useDimensionsProps,
 } from '@wordpress/block-editor';
-import { useSelect } from '@wordpress/data';
-import { store as coreDataStore } from '@wordpress/core-data';
 import { useState } from '@wordpress/element';
 import { SVG, Rect, Path } from '@wordpress/primitives';
+import { useSelect } from '@wordpress/data';
+import { store as coreDataStore } from '@wordpress/core-data';
 
 /**
  * Internal dependencies
  */
 import { useToolsPanelDropdownMenuProps } from '../utils/hooks';
 import HtmlRenderer from '../utils/html-renderer';
 import { CustomInserterModal } from './components';
-import { unlock } from '../lock-unlock';
 
 const IconPlaceholder = ( { className, style } ) => (
 	<SVG
@@ -70,14 +69,25 @@ export function Edit( { attributes, setAttributes } ) {
 	const borderProps = useBorderProps( attributes );
 	const dimensionsProps = useDimensionsProps( attributes );
 
-	const allIcons = useSelect( ( select ) => {
-		return unlock( select( coreDataStore ) ).getIcons();
-	}, [] );
+	const { selectedIcon, allIcons = [] } = useSelect(
+		( select ) => {
+			const { getEntityRecord, getEntityRecords } =
+				select( coreDataStore );
+			return {
+				selectedIcon: icon
+					? getEntityRecord( 'root', 'icon', icon )
+					: null,
+				allIcons: isInserterOpen
+					? getEntityRecords( 'root', 'icon', {
+							per_page: -1,
+					  } )
+					: undefined,
+			};
+		},
+		[ isInserterOpen, icon ]
+	);
 
-	const iconToDisplay =
-		allIcons?.length > 0
-			? allIcons?.find( ( { name } ) => name === icon )?.content
-			: '';
+	const iconToDisplay = selectedIcon?.content || '';
 
 	const blockControls = (
 		<>
 
@@ -226,6 +226,15 @@ export const rootEntitiesConfig = [
 		plural: 'fontCollections',
 		key: 'slug',
 	},
+	{
+		label: __( 'Icons' ),
+		name: 'icon',
+		kind: 'root',
+		baseURL: '/wp/v2/icons',
+		baseURLParams: { context: 'view' },
+		plural: 'icons',
+		key: 'name',
+	},
 ].map( ( entity ) => {
 	const syncEnabledRootEntities = new Set( [ 'comment' ] );
 
 
@@ -0,0 +1,30 @@
+/**
+ * Internal dependencies
+ */
+import type { Context, OmitNevers } from './helpers';
+
+import type { BaseEntityRecords as _BaseEntityRecords } from './base-entity-records';
+
+declare module './base-entity-records' {
+	export namespace BaseEntityRecords {
+		/* eslint-disable-next-line @typescript-eslint/no-unused-vars */
+		export interface Icon< C extends Context > {
+			/**
+			 * The icon name.
+			 */
+			name: string;
+			/**
+			 * The icon content (SVG markup).
+			 */
+			content: string;
+			/**
+			 * The icon label.
+			 */
+			label: string;
+		}
+	}
+}
+
+export type Icon< C extends Context = 'edit' > = OmitNevers<
+	_BaseEntityRecords.Icon< C >
+>;
@@ -12,6 +12,7 @@ import type {
 } from './font-collection';
 import type { FontFamily, FontFace, WpFontFamily } from './font-family';
 import type { GlobalStylesRevision } from './global-styles-revision';
+import type { Icon } from './icon';
 import type { MenuLocation } from './menu-location';
 import type { NavMenu } from './nav-menu';
 import type { NavMenuItem } from './nav-menu-item';
@@ -45,6 +46,7 @@ export type {
 	FontFace,
 	FontFamily,
 	GlobalStylesRevision,
+	Icon,
 	MenuLocation,
 	NavMenu,
 	NavMenuItem,
@@ -109,6 +111,7 @@ export interface PerPackageEntityRecords< C extends Context > {
 		| Comment< C >
 		| FontCollection< C >
 		| GlobalStylesRevision< C >
+		| Icon< C >
 		| MenuLocation< C >
 		| NavMenu< C >
 		| NavMenuItem< C >
 
@@ -160,17 +160,3 @@ export function receiveEditorAssets( assets ) {
 		assets,
 	};
 }
-
-/**
- * Returns an action object used to receive icons.
- *
- * @param {Array} icons List of icons.
- *
- * @return {Object} Action object.
- */
-export function receiveIcons( icons ) {
-	return {
-		type: 'RECEIVE_ICONS',
-		icons,
-	};
-}
@@ -6,12 +6,7 @@ import { createSelector, createRegistrySelector } from '@wordpress/data';
 /**
  * Internal dependencies
  */
-import {
-	getDefaultTemplateId,
-	getEntityRecord,
-	type State,
-	type Icon,
-} from './selectors';
+import { getDefaultTemplateId, getEntityRecord, type State } from './selectors';
 import { STORE_NAME } from './name';
 import { unlock } from './lock-unlock';
 import { getSyncManager } from './sync';
@@ -309,13 +304,3 @@ export function getEditorSettings(
 export function getEditorAssets( state: State ): Record< string, any > | null {
 	return state.editorAssets;
 }
-
-/**
- * Returns the list of available icons.
- *
- * @param state Data state.
- * @return The list of icons or empty array if not loaded.
- */
-export function getIcons( state: State ): Icon[] {
-	return state.icons ?? [];
-}
@@ -660,22 +660,6 @@ export function editorAssets( state = null, action ) {
 	return state;
 }
 
-/**
- * Reducer managing icons.
- *
- * @param {Array}  state  Current state.
- * @param {Object} action Action object.
- *
- * @return {Array} Updated state.
- */
-export function icons( state = [], action ) {
-	switch ( action.type ) {
-		case 'RECEIVE_ICONS':
-			return action.icons;
-	}
-	return state;
-}
-
 /**
  * Reducer managing sync connection states for entities.
  * Keyed by "kind/name:id" (e.g., "postType/post:123").
@@ -725,6 +709,5 @@ export default combineReducers( {
 	registeredPostMeta,
 	editorSettings,
 	editorAssets,
-	icons,
 	syncConnectionStatuses,
 } );
@@ -1255,15 +1255,3 @@ export const getEditorAssets =
 		} );
 		dispatch.receiveEditorAssets( assets );
 	};
-
-/**
- * Requests icons from the REST API.
- */
-export const getIcons =
-	() =>
-	async ( { dispatch } ) => {
-		const icons = await apiFetch( {
-			path: '/wp/v2/icons',
-		} );
-		dispatch.receiveIcons( icons );
-	};