diff --git a/packages/block-editor/src/components/block-alignment-control/constants.js b/packages/block-editor/src/components/block-alignment-control/constants.js
new file mode 100644
index 0000000000000..f32a815b02f67
--- /dev/null
+++ b/packages/block-editor/src/components/block-alignment-control/constants.js
@@ -0,0 +1,45 @@
+/**
+ * WordPress dependencies
+ */
+import { __, _x } from '@wordpress/i18n';
+import {
+	alignNone,
+	positionCenter,
+	positionLeft,
+	positionRight,
+	stretchFullWidth,
+	stretchWide,
+} from '@wordpress/icons';
+
+export const BLOCK_ALIGNMENTS_CONTROLS = {
+	none: {
+		icon: alignNone,
+		title: _x( 'None', 'Alignment option' ),
+	},
+	left: {
+		icon: positionLeft,
+		title: __( 'Align left' ),
+	},
+	center: {
+		icon: positionCenter,
+		title: __( 'Align center' ),
+	},
+	right: {
+		icon: positionRight,
+		title: __( 'Align right' ),
+	},
+	wide: {
+		icon: stretchWide,
+		title: __( 'Wide width' ),
+	},
+	full: {
+		icon: stretchFullWidth,
+		title: __( 'Full width' ),
+	},
+};
+
+export const DEFAULT_CONTROL = 'none';
+
+export const POPOVER_PROPS = {
+	isAlternate: true,
+};
diff --git a/packages/block-editor/src/components/block-alignment-control/ui.js b/packages/block-editor/src/components/block-alignment-control/ui.js
index 7004e32fbaf29..5cf3867f09178 100644
--- a/packages/block-editor/src/components/block-alignment-control/ui.js
+++ b/packages/block-editor/src/components/block-alignment-control/ui.js
@@ -6,60 +6,23 @@ import classNames from 'classnames';
 /**
  * WordPress dependencies
  */
-import { __, _x } from '@wordpress/i18n';
+import { __ } from '@wordpress/i18n';
 import {
 	ToolbarDropdownMenu,
 	ToolbarGroup,
 	MenuGroup,
 	MenuItem,
 } from '@wordpress/components';
-import {
-	alignNone,
-	positionCenter,
-	positionLeft,
-	positionRight,
-	stretchFullWidth,
-	stretchWide,
-} from '@wordpress/icons';
-import { Platform } from '@wordpress/element';
 
 /**
  * Internal dependencies
  */
 import useAvailableAlignments from './use-available-alignments';
-
-const BLOCK_ALIGNMENTS_CONTROLS = {
-	none: {
-		icon: alignNone,
-		title: _x( 'None', 'Alignment option' ),
-	},
-	left: {
-		icon: positionLeft,
-		title: __( 'Align left' ),
-	},
-	center: {
-		icon: positionCenter,
-		title: __( 'Align center' ),
-	},
-	right: {
-		icon: positionRight,
-		title: __( 'Align right' ),
-	},
-	wide: {
-		icon: stretchWide,
-		title: __( 'Wide width' ),
-	},
-	full: {
-		icon: stretchFullWidth,
-		title: __( 'Full width' ),
-	},
-};
-
-const DEFAULT_CONTROL = 'none';
-
-const POPOVER_PROPS = {
-	isAlternate: true,
-};
+import {
+	BLOCK_ALIGNMENTS_CONTROLS,
+	DEFAULT_CONTROL,
+	POPOVER_PROPS,
+} from './constants';
 
 function BlockAlignmentUI( {
 	value,
@@ -92,72 +55,69 @@ function BlockAlignmentUI( {
 		label: __( 'Align' ),
 		toggleProps: { describedBy: __( 'Change alignment' ) },
 	};
-	const extraProps =
-		isToolbar || Platform.isNative
-			? {
-					isCollapsed: isToolbar ? isCollapsed : undefined,
-					controls: enabledControls.map(
-						( { name: controlName } ) => {
-							return {
-								...BLOCK_ALIGNMENTS_CONTROLS[ controlName ],
-								isActive:
-									value === controlName ||
-									( ! value && controlName === 'none' ),
-								role: isCollapsed ? 'menuitemradio' : undefined,
-								onClick: () => onChangeAlignment( controlName ),
-							};
-						}
-					),
-			  }
-			: {
-					children: ( { onClose } ) => {
-						return (
-							<>
-								<MenuGroup className="block-editor-block-alignment-control__menu-group">
-									{ enabledControls.map(
-										( { name: controlName, info } ) => {
-											const {
-												icon,
-												title,
-											} = BLOCK_ALIGNMENTS_CONTROLS[
-												controlName
-											];
-											// If no value is provided, mark as selected the `none` option.
-											const isSelected =
-												controlName === value ||
-												( ! value &&
-													controlName === 'none' );
-											return (
-												<MenuItem
-													key={ controlName }
-													icon={ icon }
-													iconPosition="left"
-													className={ classNames(
-														'components-dropdown-menu__menu-item',
-														{
-															'is-active': isSelected,
-														}
-													) }
-													isSelected={ isSelected }
-													onClick={ () => {
-														onChangeAlignment(
-															controlName
-														);
-														onClose();
-													} }
-													role="menuitemradio"
-													info={ info }
-												>
-													{ title }
-												</MenuItem>
-											);
-										}
-									) }
-								</MenuGroup>
-							</>
-						);
-					},
-			  };
+	const extraProps = isToolbar
+		? {
+				isCollapsed,
+				controls: enabledControls.map( ( { name: controlName } ) => {
+					return {
+						...BLOCK_ALIGNMENTS_CONTROLS[ controlName ],
+						isActive:
+							value === controlName ||
+							( ! value && controlName === 'none' ),
+						role: isCollapsed ? 'menuitemradio' : undefined,
+						onClick: () => onChangeAlignment( controlName ),
+					};
+				} ),
+		  }
+		: {
+				children: ( { onClose } ) => {
+					return (
+						<>
+							<MenuGroup className="block-editor-block-alignment-control__menu-group">
+								{ enabledControls.map(
+									( { name: controlName, info } ) => {
+										const {
+											icon,
+											title,
+										} = BLOCK_ALIGNMENTS_CONTROLS[
+											controlName
+										];
+										// If no value is provided, mark as selected the `none` option.
+										const isSelected =
+											controlName === value ||
+											( ! value &&
+												controlName === 'none' );
+										return (
+											<MenuItem
+												key={ controlName }
+												icon={ icon }
+												iconPosition="left"
+												className={ classNames(
+													'components-dropdown-menu__menu-item',
+													{
+														'is-active': isSelected,
+													}
+												) }
+												isSelected={ isSelected }
+												onClick={ () => {
+													onChangeAlignment(
+														controlName
+													);
+													onClose();
+												} }
+												role="menuitemradio"
+												info={ info }
+											>
+												{ title }
+											</MenuItem>
+										);
+									}
+								) }
+							</MenuGroup>
+						</>
+					);
+				},
+		  };
 
 	return <UIComponent { ...commonProps } { ...extraProps } />;
 }
diff --git a/packages/block-editor/src/components/block-alignment-control/ui.native.js b/packages/block-editor/src/components/block-alignment-control/ui.native.js
new file mode 100644
index 0000000000000..8faa8fe3e0d59
--- /dev/null
+++ b/packages/block-editor/src/components/block-alignment-control/ui.native.js
@@ -0,0 +1,86 @@
+/**
+ * WordPress dependencies
+ */
+import { __ } from '@wordpress/i18n';
+import {
+	ToolbarDropdownMenu,
+	ToolbarGroup,
+	BottomSheetSelectControl,
+} from '@wordpress/components';
+
+/**
+ * Internal dependencies
+ */
+import useAvailableAlignments from './use-available-alignments';
+import {
+	BLOCK_ALIGNMENTS_CONTROLS,
+	DEFAULT_CONTROL,
+	POPOVER_PROPS,
+} from './constants';
+
+function BlockAlignmentUI( {
+	value,
+	onChange,
+	controls,
+	isToolbar,
+	isCollapsed = true,
+	isBottomSheetControl = false,
+} ) {
+	const enabledControls = useAvailableAlignments( controls );
+	const hasEnabledControls = !! enabledControls.length;
+
+	if ( ! hasEnabledControls ) {
+		return null;
+	}
+
+	function onChangeAlignment( align ) {
+		onChange( [ value, 'none' ].includes( align ) ? undefined : align );
+	}
+
+	const activeAlignmentControl = BLOCK_ALIGNMENTS_CONTROLS[ value ];
+	const defaultAlignmentControl =
+		BLOCK_ALIGNMENTS_CONTROLS[ DEFAULT_CONTROL ];
+
+	const toolbarUIComponent = isToolbar ? ToolbarGroup : ToolbarDropdownMenu;
+	const UIComponent = isBottomSheetControl
+		? BottomSheetSelectControl
+		: toolbarUIComponent;
+
+	const commonProps = {
+		label: __( 'Align' ),
+	};
+	const extraProps = isBottomSheetControl
+		? {
+				options: enabledControls.map( ( { name: controlName } ) => {
+					const control = BLOCK_ALIGNMENTS_CONTROLS[ controlName ];
+					return {
+						value: controlName,
+						label: control.title,
+						icon: control.icon,
+					};
+				} ),
+				value: activeAlignmentControl ? value : 'none',
+				onChange: ( align ) => onChangeAlignment( align ),
+		  }
+		: {
+				icon: activeAlignmentControl
+					? activeAlignmentControl.icon
+					: defaultAlignmentControl.icon,
+				isCollapsed: isToolbar ? isCollapsed : undefined,
+				controls: enabledControls.map( ( { name: controlName } ) => {
+					return {
+						...BLOCK_ALIGNMENTS_CONTROLS[ controlName ],
+						isActive:
+							value === controlName ||
+							( ! value && controlName === 'none' ),
+						onClick: () => onChangeAlignment( controlName ),
+					};
+				} ),
+				popoverProps: POPOVER_PROPS,
+				toggleProps: { describedBy: __( 'Change alignment' ) },
+		  };
+
+	return <UIComponent { ...commonProps } { ...extraProps } />;
+}
+
+export default BlockAlignmentUI;
diff --git a/packages/block-library/src/latest-posts/edit.native.js b/packages/block-library/src/latest-posts/edit.native.js
index 08f1f5abe9b58..30d82fde4c1fa 100644
--- a/packages/block-library/src/latest-posts/edit.native.js
+++ b/packages/block-library/src/latest-posts/edit.native.js
@@ -12,7 +12,10 @@ import { compose, withPreferredColorScheme } from '@wordpress/compose';
 import { withDispatch, withSelect } from '@wordpress/data';
 import { __ } from '@wordpress/i18n';
 import { postList as icon } from '@wordpress/icons';
-import { InspectorControls } from '@wordpress/block-editor';
+import {
+	InspectorControls,
+	BlockAlignmentControl,
+} from '@wordpress/block-editor';
 import apiFetch from '@wordpress/api-fetch';
 import {
 	Icon,
@@ -43,6 +46,15 @@ class LatestPostsEdit extends Component {
 		);
 		this.onSetExcerptLength = this.onSetExcerptLength.bind( this );
 		this.onSetDisplayPostDate = this.onSetDisplayPostDate.bind( this );
+		this.onSetDisplayFeaturedImage = this.onSetDisplayFeaturedImage.bind(
+			this
+		);
+		this.onSetFeaturedImageAlign = this.onSetFeaturedImageAlign.bind(
+			this
+		);
+		this.onSetAddLinkToFeaturedImage = this.onSetAddLinkToFeaturedImage.bind(
+			this
+		);
 		this.onSetOrder = this.onSetOrder.bind( this );
 		this.onSetOrderBy = this.onSetOrderBy.bind( this );
 		this.onSetPostsToShow = this.onSetPostsToShow.bind( this );
@@ -95,6 +107,21 @@ class LatestPostsEdit extends Component {
 		setAttributes( { displayPostDate: value } );
 	}
 
+	onSetDisplayFeaturedImage( value ) {
+		const { setAttributes } = this.props;
+		setAttributes( { displayFeaturedImage: value } );
+	}
+
+	onSetAddLinkToFeaturedImage( value ) {
+		const { setAttributes } = this.props;
+		setAttributes( { addLinkToFeaturedImage: value } );
+	}
+
+	onSetFeaturedImageAlign( value ) {
+		const { setAttributes } = this.props;
+		setAttributes( { featuredImageAlign: value } );
+	}
+
 	onSetOrder( value ) {
 		const { setAttributes } = this.props;
 		setAttributes( { order: value } );
@@ -124,6 +151,9 @@ class LatestPostsEdit extends Component {
 			displayPostContentRadio,
 			excerptLength,
 			displayPostDate,
+			displayFeaturedImage,
+			featuredImageAlign,
+			addLinkToFeaturedImage,
 			order,
 			orderBy,
 			postsToShow,
@@ -166,6 +196,31 @@ class LatestPostsEdit extends Component {
 						onChange={ this.onSetDisplayPostDate }
 					/>
 				</PanelBody>
+
+				<PanelBody title={ __( 'Featured image settings' ) }>
+					<ToggleControl
+						label={ __( 'Display featured image' ) }
+						checked={ displayFeaturedImage }
+						onChange={ this.onSetDisplayFeaturedImage }
+					/>
+					{ displayFeaturedImage && (
+						<>
+							<BlockAlignmentControl
+								value={ featuredImageAlign }
+								onChange={ this.onSetFeaturedImageAlign }
+								controls={ [ 'left', 'center', 'right' ] }
+								isBottomSheetControl={ true }
+							/>
+							<ToggleControl
+								label={ __( 'Add link to featured image' ) }
+								checked={ addLinkToFeaturedImage }
+								onChange={ this.onSetAddLinkToFeaturedImage }
+								separatorType={ 'topFullWidth' }
+							/>
+						</>
+					) }
+				</PanelBody>
+
 				<PanelBody title={ __( 'Sorting and filtering' ) }>
 					<QueryControls
 						{ ...{ order, orderBy } }
diff --git a/packages/components/src/mobile/bottom-sheet-select-control/index.native.js b/packages/components/src/mobile/bottom-sheet-select-control/index.native.js
index bc4a828dd9bdf..6d88c349b7834 100644
--- a/packages/components/src/mobile/bottom-sheet-select-control/index.native.js
+++ b/packages/components/src/mobile/bottom-sheet-select-control/index.native.js
@@ -82,6 +82,7 @@ const BottomSheetSelectControl = ( {
 							customActionButton
 							separatorType="none"
 							label={ item.label }
+							icon={ item.icon }
 							onPress={ onChangeValue( item.value ) }
 							leftAlign={ true }
 							key={ index }
diff --git a/packages/react-native-editor/CHANGELOG.md b/packages/react-native-editor/CHANGELOG.md
index 8b988cd3b6ef0..ff2f4bb5d9554 100644
--- a/packages/react-native-editor/CHANGELOG.md
+++ b/packages/react-native-editor/CHANGELOG.md
@@ -11,7 +11,10 @@ For each user feature we should also add a importance categorization label  to i
 
 ## Unreleased
 
+-   [*] Add featured image settings to Latest Posts block [#39257]
+
 ## 1.74.1
+
 -   [**] RichText - Set a default value for selection values [#40581]
 
 ## 1.74.0