CODEWITHSUNDEEP
htmlgoogle-chromefavicontaskbar
Vartlok
Vartlok

Reputation: 2589

Favicon is pixelated in windows taskbar

I have to set favicon for my website but icon always looks very bad in windows taskbar although I use icon 130x130

My html:

<link rel="shortcut icon" href="/img/favicon.ico" type="image/x-icon">

How it looks:

example

Amazon icon was taken just as example.

Icon was created by icon plugin for Paint.NET. Also i tried to create icon with 128x128 and 64x64, result was worse. Also i tried to use 256x256 result is better, but still is pixelated. But if i create link on this page on task bar icon will be fine.

Can someone help me?

Upvotes: 0

Views: 3332

Answers (4)

Yumna Arshad
Yumna Arshad

Reputation: 1

Use favicon as .svg (vector) file instead of .png it will definitely work and not pixealated.

Upvotes: -1

silvenon
silvenon

Reputation: 2197

A single link like this isn't enough, browsers won't just automatically resize and use the favicon appropriately. Try following this nice favicon cheat sheet.

Upvotes: 1

philippe_b
philippe_b

Reputation: 41378

Microsoft recommends to put three pictures in the favicon.ico file: 16x16, 32x32 and 48x48. IE is able to pick the suitable one. Chrome and Firefox use a PNG icon, declared with:

<link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32">

This favicon generator produces such favicon.ico and PNG icons. The end result is fine. When adding an icon to the task bar, IE uses the 32x32 picture, Chrome the 196x196 PNG picture and Firefox the 32x32 PNG picture. Full disclosure: I'm the author of this site.

Upvotes: 3

Mego
Mego

Reputation: 164

Standard icon size is 16X16 px. or 32X32 px. so use this size. favicon (due CSS3) needn't be in .ico file. Just try to use .png file

Upvotes: 0

Related Questions