Fix Safari FavIcons

safari-favicons.sh

#!/bin/zsh
# Fix Safari Favorites Icons

CS="cache_settings"; TIC="Touch Icons Cache"; DIR="$HOME/Library/Safari/$TIC/Images"
DB="$DIR/../${${TIC// }%%s*}${${(C)CS}//_}.db"; SQL=$(sqlite3 "$DB" "SELECT host FROM $CS")
sqlite3 "$DB" "UPDATE $CS SET ${${${(L)TIC// /_}#*_}//s/_is_in}=1, download_status_flags=1"
for png in "$1"/*.png; do URL="$(plutil -convert xml1 -o - "$DIR/../../Bookmarks.plist" | \
awk -F '[</>]' -v name="${${png##*/}%%.*}" '$3~name{getline;getline;getline;print $5}')"; \
cp -f -v "$png" "$DIR/${(U)$(md5 -q -s $URL)}.png"; done; chflags -v uappnd $DIR $DB*

Thank you so much!

@shearer123 11.3 broke my icons as well. I went to the /Users/%your_username%/Library/Safari/ folder, deleted the Touch Icons Cache folder completely and started over. This fixed it and the method still works very well. I'm the reddit guy, by the way c:

What's interesting is that before the deletion my icons were really sluggish to appear (turns out many files in the Touch Icons Cache slows the process down) and I had two website icons that would refuse to show up even with this method. But, after wiping out the folder and starting anew, the icons appear much faster and all of my websites now have an icon.

deleting the db does not fix bookmarks icons

deleting the db does not fix bookmarks icons

You mean it's a bug?

@dardo82 I don't mean anything otherwise from the fact that this db state has no effect on bookmark favicons 🤷

I’ve just checked and it still works!
Feels good when you can reuse it.

Sometimes the icon will displa with a lower size, leaving borders. I could not understand why . See Netflix on the attached picture. Any one got any chance in solving this ?

What's on the left?

Another icon that fails to fill the expected space..

I suppose those are stock icons, use custom icons. 🧑‍💻

Ok I did not explain It properly sorry. All the icons are custom ones. The stock ones (generated by Safari using favicon) are different so I can see it actually "works". I mean the script replaces the cache and it is displayed here (as seen on the screenshot). Though for some reasons, and only for some apps (not always the same btw), the icons do not fit the whole space, showing borders. I tried with different icons sizes, including huge ones. It happened after the last update, Safari was not part of the changelog though

What was wrong with the stock icons then?

For some websites: Not pretty
For some websites: Unknown (no favicon or something, the icon is just not found)
For some websites: Found but not fullscreen or other problems (which is kinda the same issue as "Not pretty")
I'm almost replacing all icons. Most work, some don't (or not as expected)

So what about YouTube and NetFlix?

As I'm replacing most icons so everything looks good, I'm replacing those too. I found images cropped those properly, and ran the script again. Those two fail to show properly which is not the case of every icons. But sometimes I rerun the script and they do show properly, only, other icons don't.. For example today, YouTube fills the whole icon, yeay (but Netflix don't ..)

So it's seemingly random behaviour?

Sometimes the icon will displa with a lower size, leaving borders. I could not understand why . See Netflix on the attached picture. Any one got any chance in solving this ?

Within ~/Library/Safari/Touch Icons Cache/TouchIconCacheSettings.db the column transparency_analysis_result seems to change how the image is displayed.
I've found changing it to 1 can remove the border spacing.
It initially seems to cause an issue where adding/renaming/removing bookmarks in Safari, however this seems to fix itself after a few minutes. It's possibly to do with the hashing changing on file verification.

Thanks for the interesting tidbits.

Funky thread! I landed here while investigating why the SVG favicon I added to a website I'm working on doesn't show on mobile Safari but it shows correctly on Safari Desktop. I still couldn't figure it out but while reading through these posts I gladly concluded I am not the only person completely crazy about how my icons look on the screen. And I'm not just talking about favicons. I have my own app dock icons as well. If a software update changes the icons to a white rectangled version (the current trend) I replace it with my own (a freeform icon) and clear the cache. :)

What site is it?

What site is it?

https://lifeline-qobalt-y5enyaceaq-nw.a.run.app/

It works on Android.

That's good to know, thanks.