Font Awesome icon for WordPress menu item.

navigation.css

/*
 * I'm specifically targeting a URL here, but I'd recommend using a custom
 * CSS class for the Navigation Link block instead.
 */
.wp-block-navigation-link a[href*="/my-account"]::before {
	content: "";
	display: inline-block;
	width: 1em;
	height: 1em;
	margin-right: 0.5em;

	/* Font Awesome user icon: https://fontawesome.com/icons/user?f=classic&s=solid */
	background: no-repeat url( 'data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" height="16" width="14" viewBox="0 0 448 512"><path d="M224 256A128 128 0 1 0 224 0a128 128 0 1 0 0 256zm-45.7 48C79.8 304 0 383.8 0 482.3C0 498.7 13.3 512 29.7 512H418.3c16.4 0 29.7-13.3 29.7-29.7C448 383.8 368.2 304 269.7 304H178.3z"/></svg>' );
}

/*
 * This is used to hide the label but allow it for screen readers. Use whatever
 * your preferred CSS is here. Again, I'm targeting the URL, but a specific CSS 
 * class would work best. You'd probably also want to add a bit of code for focus.
 */
.wp-block-navigation-link a[href*="/my-account"] .wp-block-navigation-item__label {
	border: 0 !important;
	clip: rect(1px, 1px, 1px, 1px) !important;
	-webkit-clip-path: inset(50%) !important;
		clip-path: inset(50%) !important;
	height: 1px !important;
	margin: -1px !important;
	overflow: hidden !important;
	padding: 0 !important;
	position: absolute !important;
	width: 1px !important;
	white-space: nowrap !important;
}