Web Design » Photoshop » How Do I Make a Favicon in Photoshop?

How Do I Make a Favicon in Photoshop?

Last updated on September 24, 2022 @ 12:31 pm

A favicon is a small icon that appears in the browser’s address bar next to your website’s name. Creating a favicon can be a bit of a challenge, but with the help of Photoshop, it can be easily accomplished. Follow the steps below and you’ll have your own favicon in no time!

1. Start by creating a new document in Photoshop with the dimensions 16×16 pixels. This is the standard size for a favicon, so we’ll stick with that.

2. Now you can begin designing your icon. Keep in mind that since it’s so small, you’ll want to keep things simple. A few basic shapes or even just a simple logo should do the trick.

3. Once you’re happy with your design, go to File > Save As and save your document as a .ico file. This is the file type that favicons use.

4. The last step is to upload your new favicon to your website. This is typically done by adding a line of code to the .htaccess file on your server. If you’re not sure how to do this, consult your web host or check out some online tutorials.

5.


That’s it! You should now have a shiny new favicon for your website.

Creating one may take a bit of time and effort, but it’s definitely worth it in the end. Your visitors will appreciate the extra touch, and it will help make your site more memorable.

PRO TIP: This article contains outdated information. Photoshop no longer supports the creation of favicons.
Dale Leydon

Dale Leydon

Sysadmin turned Javascript developer. Owner of 20+ apps graveyard, and a couple of successful ones.