DEV Community

Goran Jakovljevic
Goran Jakovljevic

Posted on

The right way to add apple touch icons in NextJS

So, some tutorials suggest adding it like this in

<link rel="apple-touch-icon" sizes="180x180" href="/images/favicons/apple-touch-icon.png" />

but, for some "unknown" reason, if you have root file in /pages/ thats using slug such as [slug].tsx, apple devices will run [slug].tsx when fetching apple-touch-icon linked like that.

Solution was to just create 2 png files

apple-touch-icon-precomposed.png
apple-touch-icon.png

and add them directly to public folder. No need to link it in

Thats it.

Top comments (0)