Favicon issues

Joined
Feb 19, 2024
Messages
1
Reaction score
0
I tried my best to implement favicon that will work as best as it can for phone browsers, pc browsers and different OS. So, here is it:

HTML:
  <link rel="icon" type="image/png" href="/AlmarsImages/Website/faviconnew.png">
  <link rel="apple-touch-icon" sizes="180x180" href="/AlmarsImages/Website/faviconnew.png">
  <link rel="manifest" href="manifest.json" />

My manifest:
Code:
{
    "icons": [
      { "src": "/AlmarsImages/Website/faviconnew.png", "type": "image/png", "sizes": "180x180" }
    ]
  }

Now, code works fine on PC versions. Google chrome is making an issue on the phone. Also, it seems that Safari doesn't stretch the favicon to it's full width and height but rather have some kind of transparent border.

Screenshot_1.jpg


And favicon not showing:

1708359217927.png


By the way, in case you think favicon is too small, it is not. It's actually 1300x1000 😅
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,755
Messages
2,569,534
Members
45,008
Latest member
Rahul737

Latest Threads

Top