I have fiddled a bit, as per below. The new icon shows in Google Chromes tab’s favicon. I do not know yet if Google will pick it up and use in Search results pages.
The logo you can add in the customizer, is WordPress’ own generic logo settings. I deleted that image. I then saved the logo as a 24-png 480 x 480 px with transparency. I uploaded the file to root. Then used this code in functions.php
add_action('wp_head', function() {
?>
<link rel="icon" type="image/png" sizes="480x480" >
<?php
});
I am also fiddling with this. You’ll have to read up on it yourself.
https://realfavicongenerator.net/
It creates a number of files (upload to root of site) and html code links to add to the header for different kind of devices. This is the code I am adding to the header.
add_action('wp_head', function() {
?>
<link rel="icon" type="image/png" sizes="480x480" >
<link rel="manifest" >
<link rel="mask-icon" color="#5bbad5">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="theme-color" content="#ffffff">
<?php
});
Good luck!