Making .ico files such as favicon.ico with Adobe Photoshop

BW

Brian Wozeniak

3.4k 44
Created
Updated
Viewed
248k times

I was looking around today on if it was possible to make .ico files with Adobe Photoshop. I mostly need to create .ico files for websites which are usually named favicon.ico if you use the default name or via the HTML tag:

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

Before I would always download some free program whenever I needed to make an ico file, as by default Adobe does not. So today I was looking around and found this excellent ico plugin for Adobe Photoshop that gives you the option to save a file as a .ico.

For me, I had to download the Windows 64-bit package. Now all you have to do is extract icoformat.8bi to your plugins folder for Adobe Photoshop:

Adobe Photoshop 2022 Plugins Folder for ICO Plugin

If you already have Adobe Photoshop open you will need to restart it after you copy the plugin folder to the Adobe Plugins folder.

Now the next time you use Adobe Photoshop you will have the option to save, make, create, and load .ico files!

Save as ICO Windows Icon Favicon in Adobe Photoshop

Once you save the ICO you will be prompted to choose an ICO format, I usually just choose Standard ICO which is what is used for favicon.ico:

Choose ICO Format Dialog in Adobe Photoshop

  • 0
    excellent! šŸ˜ Nnow I don't have to go all back-asswards and rename .gif or .bmp to .ico to get it to work! — UNFLUX
  • 0
    Thanks for the advice, I've recently become addicted to downloading icons, and I'll be glad to be able to use Adobe to make them. I only hope it works with 7.0 šŸ˜‰ — Lady Kairuka
  • 0
    God Bless you! — Mark Bowker
  • 0
    This popped up right on the top of my search and it was just the answer I needed. Thanks much! — woodstock
  • 0
    Woodstock - I'm glad you found this today. I had meant to download and install this last month, and completely forgot to. Got it done now though! — Mark Bowker
  • 0
    That is really cool, thanks for that link. I must have downloaded and deleted freeware ico makers about 4-5 times. Icons are awesome! I think everyone should use them — Vladdrac
  • 0
    I was also renaming .gifs. Thanks! — benoitb
  • 0
    Sweet find! Come to me home made icons! šŸ˜ˆ — nekio
  • 0
    šŸ˜› Great pointer...Thanks a million — rikahs
add a comment
0

10 Replies

  • Votes
  • Oldest
  • Latest
TR

Truce

10 0
Replied
Updated

I used to do the same thing (download and delete). I found a better way though. I got Visual Studio .NET to program and I found out that you can create icons using it! I've made icons in Adobe Photoshop before by renaming files and they end up messed up.

add a comment
0
SH

sharonmooney

0 0
Replied
Updated

You are the man! I had purchased software to make icons.

Shortly after I enrolled in college (pursuing a Bachelor of Science in web design and multimedia). Adobe PhotoShop CS is a program we have been required to study. I've taken some files edited in Adobe, and transferred them to the Icon software. I'm usually skeptical, but when something is good, it works, and it's an honest deal -- that's something worth talking about! Wow, I am just clean amazed... it works just like you said it would.

Way too cool!

add a comment
0
FN

FiveseveN

0 0
Replied
Updated

I'm sorry to spoil the fun, but can you make multiple-page .ico files? You know, there's more to .ico than a renamed bitmap. Yet it does save 32-bit icons and my old icon editing software can't (Axalis AX-Icons).

add a comment
0
SF

SpooF

25 0
Replied

What dimentions do you make favicons?

  • 0
    Going entirely from memory 32x32 or 64x64 — Mark Bowker
  • 0
    They display in the Internet Explorer browser as a 16x16 though, don't they? So it would be safe to make them that size too, though I make mine at 32x32. — sharonmooney
  • 0
    Correct. For that matter, you could also make them 128x128. 32x32 trends to be the most common. They will automatically shrink to the 16x16 size, and I think you end up with better resolution by using the larger size vs. 16x16 — Mark Bowker
add a comment
0
TR

Truce

10 0
Replied

Well, if you go to the download page of that website you will also see he has an icon "packager" if you will. Basically you can create your 64x64 icon and save it....resize it to 32x32 and save it.....resize it to 24x24 and save it......resize it to 16x16 and save it.....resize it to 8x8 and save it.....and then run the packaging utility to turn it into one single icon! That way you get the best quality regardless of what size it is displayed at, and you have an icon for every used size!

Cheers!

add a comment
0
WU

Wurn

0 1
Replied
Updated

Man paying to create .ico files is just plain wrong. Here we are using Photoshop a package made to create and one cannot make a .ico file until now.

Thanks for the tips and using Visual Studio .Net as well is also a great idea, but I'd prefer Adobe Photoshop.

  • 0
    No kidding! I've seen advertisements for custom-made ico's seventy-five bucks. Outrageous. šŸ˜± — sharonmooney
add a comment
0
RT

RockmanTV

0 0
Replied
Updated

Great Find! šŸ˜

I remember awhile back I was looking for a photoshop plug-in but I couldn't find one and I ended up at:

https://www.degraeve.com/favicon/

It's a useful site and all, but I didn't want to have to upload my png's all the time. Thanks for that!

add a comment
0
JE

Jeffrun

0 0
Replied
Updated

Are the icons available on Safari (Mac)?

I did everything, good location and extension stuff but nothing appears. Thanks anyway for the tip
šŸ‘

add a comment
0
CO

corl

0 0
Replied
Updated

But how about the Adobe Photoshop CS3?

all versions of Photoshop (3.0-7.0, CS, CS2), under Mac OS X, 9 and earlier, and Windows", except for CS3.

add a comment
0
MB

Mark Bowker

1.6k 23
Replied
Updated

https://old.marcofolio.net/webdesign/how_to_create_a_favicon_for_your_website.html

It obviously has been revised to work with CS3 (sorry I can't test it - have CS2 -- Im really surprised Adobe just didn't incorporate it i CS3)

If you have Adobe Photoshop, you can use this ICO plugin for Photoshop. Download the ICO (Windows Icon) Format and extract the ZIP-archive. Next, put the plug-in called ICOFormat.8bi in the following directory;
C:\Program Files\Adobe**Adobe Photoshop CS3**\Plug-Ins\File Formats\
Now start up Photoshop and create a new file with the width and height of 16 x 16 pixels.
Unleash your designing skills to create the Favicon and when you're done, go to "File", "Save as..." (Shift + Ctrl + S).
Name your file "favicon.ico" and set the format to "ICO (Windows Icon) (*.ICO)".

  • 0
    I tried with my CS3, but it doesn't work, it only added an option for portable bitmap. — corl
  • 0
    Well an ico file is nothing more than a bitmap. You certain the .ico extension isn't there on save as dropdown? — Mark Bowker
add a comment
0