Replace Home with image link inside custom header menu

Question

What I want to achieve is a header menu like this:

Right now, I have this:

I am not far off. To get to where I am currently at, I followed these instructions and added some custom CSS. So I added the following in my functions.php:

<?php
  function register_my_menu() {
    register_nav_menu('header-menu',__( 'Header Menu' ));
  }

  add_action( 'init', 'register_my_menu' );
 ?>

And added this to header.php:

<?php
  wp_nav_menu(array('theme_location' => 'header-menu'));
?>

I now wish to do that last step of getting the .svg logo to appear instead of the Text Home.

How do I do that? I can't see any option for that. This is of course very common in premium themes, how exactly is it done? Is there a clean way? I can probably hack it by creating a left and a right menu (ignore the cart and login for now), and then bang my logo with static HTML between the two menus, but that solution feels very wrong to me.

Any help would be greatly appreciated.

Answer 1

I couldn't find a way to place an image tag in there, so I did as Tom J Nowell suggested. I added a class and using CSS I made the text disappear and have the logo image appear in its place. It seems to work fine.